duplicate text field vaule on other text fields

**shumbora** · 10-09-2006, 07:20 PM

Hello everyone, I was attempting to build a search feature on my site that will allow visitors to search different lists of search engines.. My only problem is that i have 3 different text fields for inputting the search criteria and when ever you change the list you have to retype the search criteria. is there a way so that all three text fields can be edited at the same time meaning changing the value of one text field will change all the text field values and vies versa so no retyping of search criteria would be necessary

Code:

<html>
<head>
<title>test</title>
</head>
<body>
<script type="text/javascript">
function doSearch( selectedIndex, searchTerm ) {
   if ( selectedIndex < 0 ) {
      alert("Please select a search engine!");
      return false;
   } else if ( searchTerm == "" ) {
      alert("No search term!");
      return false;
   }
DoTheSearchInTheFrame(SEARCH_DATA[selectedIndex][1], SEARCH_DATA[selectedIndex][0]);
}

function engine1( selectedIndex, searchTerm )
{
   SEARCH_DATA= new Array(4);
   SEARCH_DATA[0]= new Array("Google","http://www.google.com/search?hl=en&q="+escape(searchTerm)+"&btnG=Google+Search");
   SEARCH_DATA[1]= new Array("Yahoo","http://search.yahoo.com/search?p="+escape(searchTerm)+"&fr=yfp-t-500&toggle=1&cop=&ei=UTF-8");
   SEARCH_DATA[2]= new Array("Altavista","http://www.altavista.com/web/results?itag=ody&q="+escape(searchTerm)+"&kgs=1&kls=0");
   SEARCH_DATA[3]= new Array("All The Web","http://alltheweb.com/search?cat=web&cs=iso88591&q"+escape(searchTerm)+"&rys=0&itag=crv&_sb_lang=pref");
    

doSearch( selectedIndex, searchTerm );
   return true;
}

function DoTheSearchInTheFrame(var_a,var_b)
{
eval("document.getElementById('inpage').src=var_a");
}
</script>
<center>
<form action="index.php" name="searchForm1" target="billy" id="search" onSubmit="javascript:engine1(this.engine.options[this.engine.selectedIndex].value,this.go.value); return false;" >
        <select name="engine" class="drop_down">
        <option value="-1" selected="selected">Select Search Engine</option>
        <option value="0">Google</option>
  
        </select>
        <input name="go" class="text_field" size="25" maxlength="35" />
        <input name="submit" type="submit" class="search_button" value="Search" />
  </form>
		
</center>
</div>
<center>
<form action="index.php" name="searchForm1" target="billy" id="search" onSubmit="javascript:engine1(this.engine.options[this.engine.selectedIndex].value,this.go.value); return false;" >
        <select name="engine" class="drop_down">
        <option value="-1" selected="selected">Select Search Engine</option>
        <option value="1">Yahoo</option>
  
        </select>
        <input name="go" class="text_field" size="25" maxlength="35" />
        <input name="submit" type="submit" class="search_button" value="Search" />
  </form>
		
</center>
</div>
<center>
</center>
</div>
</div>
<center>
<form action="index.php" name="searchForm1" target="billy" id="search" onSubmit="javascript:engine1(this.engine.options[this.engine.selectedIndex].value,this.go.value); return false;" >
        <select name="engine" class="drop_down">
        <option value="-1" selected="selected">Select Search Engine</option>
        <option value="3">All The Web</option>
  
        </select>
        <input name="go" class="text_field" size="25" maxlength="35" />
        <input name="submit" type="submit" class="search_button" value="Search" />
  </form>
		
</center>
</div>
<div align="center">
  <iframe src="http://www.altavista.com/" class="inframe" frameborder="0" id="inpage" style="width:100%;height:600px" border="0"></iframe>
</div>
</body>
</html>

Any Comments will be greatly appreciated, and thanx in advance.

**codeexploiter** · 10-10-2006, 04:38 AM

I think this is what you are looking. This is just a code skelton, once you get the idea you can build up from here

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<form name="form1" method="post" action="">
<input type="text" name="textfield" onKeyUp="document.form2.textfield2.value=this.value;"> 
  </form>
<form name="form2" method="post" action="">
  <input type="text" name="textfield2" onKeyUp="document.form1.textfield.value=this.value;">
</form>
<p>&nbsp;</p>
</body>
</html>

**djr33** · 10-10-2006, 05:34 AM

Or, you could totally redo your system which is what i'd recommend.
You could use php (maybe) and use it to load the results from ALL the search engines, not just the one, and use the single input for all the pages. You could find a (more complex) way to do this in just javascript as well.

**codeexploiter** · 10-10-2006, 06:17 AM

Yes djr33 is correct rather than relying on Javascript you can rework your system using PHP and solve the whole issue.

**djr33** · 10-10-2006, 07:41 AM

But, if that doesn't work, the above javascript could work as well.

**shumbora** · 10-13-2006, 12:38 AM

i really appreciate your help guys , the script works flawlessly... i am the first one to admit that this is probably isnt the best way to go about it but its is much easier said than done because im a complete noob and when it comes to php forget about it all i know about php is that it stars with a <? i think

,, but hey if you guys know a place where a complete noob can learn php then i always enjoy a good read.

**codeexploiter** · 10-13-2006, 04:10 AM

Please checkout this link

**djr33** · 10-13-2006, 08:20 AM

I love this tutorial....
http://php-mysql-tutorial.com

it's about using mysql (a database setup) with php... might be helpful. it could also show you more about php in doing so... maybe...

Thread: duplicate text field vaule on other text fields

Thread Tools

Search Thread

duplicate text field vaule on other text fields

Bookmarks

Bookmarks

Posting Permissions