Javascript HTML Forms and Google Search Problem

Page 1 of 1

1 Replies - 803 Views - Last Post: 24 August 2012 - 02:32 AM

#1 tdeprato  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 10
  • Joined: 29-October 11

Javascript HTML Forms and Google Search Problem

Posted 24 August 2012 - 01:56 AM

Hi-

The scripts below work fine individually. But when both forms are added to the same page the 'q' value begins to conflict. Unfortunately for Google based searches the 'q' is essential.
I have tried numerous ways to assign value to the q when needed, and using -alert messages- it seems the values make it all the way through the script. This seems so simple and I am wondering if anyone else has ideas. I have even used PHP to call the scripts when needed, but one will run and the second will not. One will always one first then the second, regardless of it's html position will not run.


Here is the JS file:

function changeText1(){
   
   var theDate = document.getElementById('userInput').value;
   var theTerm = document.getElementById('userInput2').value;
   
 
	
	var myVar = theDate + ' '+ theTerm;

    document.getElementById('q').value=myVar;
    


}

function changeText2(){
   
   var ItemFirst = document.getElementById('YouTubeInput').value;
   

	

	
	var TheVar = ItemFirst +"'&search_sort=video_avg_rating'";
	
	
	
	
	document.getElementById('q').value=TheVar;
	
	
	
	
	
	}



Here is the html :

<script type="text/javascript" src="search.js"></script>

<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
</head>

<body>

<div class="newwrapper">
<h3>Google Date Search</h3>

<!--<input type='button' onclick='changeText1()' value='Submit'/>-->



<form id ="searchMe" name="searchMe" method="get" action="http://www.google.com/search" target="_blank">

<input type='text' id='userInput' value='' />
<input type='text' id='userInput2' value='' />

<input type="hidden" id ="q" name="q" alt="Search" value="" maxlength="256" size="32" />

<input type="submit" onclick="changeText1(this.form);" name="btnG" value="Search" />

</form>
</div>


<div class="newwrapper">
<p><h3>Youtube Top Rated Search</h3></p>

<form id ="searchYouT" name="searchYouT" method="get" action="http://www.youtube.com/results" target="_blank">



<input type='text' id='YouTubeInput' value='' />

<input type="hidden" id ="q" name="q" alt="Search" value="" maxlength="256" size="32" />

<input type="submit" onclick="changeText2(this.form);" name="btnG" value="Search" />

</form>
</div


Is This A Good Question/Topic? 0
  • +

Replies To: Javascript HTML Forms and Google Search Problem

#2 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 4128
  • View blog
  • Posts: 13,023
  • Joined: 08-June 10

Re: Javascript HTML Forms and Google Search Problem

Posted 24 August 2012 - 02:32 AM

that’s because you violate one of the basic HTML rules: IDs must be unique throughout the document.

if you need the forms to work independently, use differend values for the ID.

PS. what the google search uses is the name of the field, not the ID.

This post has been edited by Dormilich: 24 August 2012 - 02:33 AM

Was This Post Helpful? 0
  • +
  • -
Page 1 of 1