HTML - Need Help With Multiple Option Search Form

Hello,

I have produced a form which can be viewed at http://www.magicalwonders.com/Freestufftest5.html and have a couple of questions I hope someone can advise me on.

Firstly, I'm not sure why the "autofill" option available on the google tool bar is not being made available for the "Name" and "Country" input.

The code I am using is as follows:

Code:

<form method='POST' action='http://www.magicalwonders.com/cgi-bin/arp3/arp3-formcapture.pl'>
<div align='center'>
<p>First name<br><input type='text' name='first_name' size='20'></p>
</center></div>
<div align='center'>
<p>Country<br>
<select name="country" input type='text' size='1'>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
</select></p>
</center></div>
<div align='center'>
<p>E-mail address<br><input type='text' name='email' size='20'></p>
</center></div>
<input type='hidden' name='subscription_type' value='E'><div align='center'>
<p><input type='submit' value='Submit'></p></div>
<input type='hidden' name='id' value='2'>
<input type='hidden' name='extra_ar' value=''>
<input type='hidden' name='first_name_man' value='1'>
<input type='hidden' name='country_man' value='1'>
<input type='hidden' name='notify_email' value='MWsubscription@hey-presto.demon.co.uk'>
<input type='hidden' name='notify_subject' value='Magical Wonders Opt In'>
</form>

The autofill highlights the email input box in yellow, but not the first two boxes. I have no idea why. I have only included two countries in the above code, to make it easier to read.

Secondly, is there any way I can center the list of Countries in the drop down box, instead of them showing hard left in the box?

Hope someone can advise.

Myles

Hi all,

I have a query regarding HTML Radio Buttons. On a site I have created I am use radio button to allow visitors to search fot various files.

Below is the code I have used.

<input type="radio" name="searchIndex" value="HMD01"/>

The "HMD01" is a field in my database. The user types in txt into a textbox and when they click a search button a function checks the "HMD01" field to see if any data matches what was in the textbox and displays the results if there are matches.

What I am trying to do is that if the search found no matches in that field that it would search another field in the database to find a match.

I thought the code would be something like the code below but that did not work.

<input type="radio" name="searchIndex" value="HMD01, PRD03"/>

The "PRD03" field contains the same type of information as "HMD01" but is stored in a different table. I want to be able to search "HMD01" for a match then search "PRD03" with the same parameters.

Any help would be greatly appreciated.

Thanks

Towsie

The tutorial on how to make a search form with multiple search options was excellent!

http://www.mediacollege.com/internet...ti-search.html

However, is it possible to use radio buttons instead of a drop-down list? Can someone be kind enough to show me the code for it?

Million thanks.

Hey -

I'm trying to fix a piece of code which will allow me to insert a Library Catalogue Search form in to my Institute's moodle. The form appears, but the search is not populated with the information input when I click search.

I'm using the following code, and my catalogue page is: http://library.kcl.ac.uk/F/X1C8CFNNK...le_name=find-b


HTML Code:

 <w:populate using="itemForEdit"> <form action="http://library.kcl.ac.uk/F/X1C8CFNNK32DAV3PAY9E1HTAQTU595XKRFJXY589I72VT6QR3V-48067?func=file&file_name=find-b" method="post"> <input type="hidden" name="Id" />
<table align="center"> <tbody>
  <tr>
    <td><label>Search: </label>
    </td>
    <td><input type="text" name="Name" />
    </td>
  </tr>
  <tr>
    <td><label>Search by: </label>
    </td>
    <td> <select name="find_code"> <option value="WRD">All Words</option> <option value="WTI">Title words</option> <option value="WJT">Journal title words</option> <option value="WPE">Authors/Names</option> <option value="WME">Conferences</option> <option value="WCO">Organisations</option> <option value="WPF">Performers</option> <option value="WMU">Year of recording</option> <option value="WPT">Printers</option> <option value="WPV">Provenance</option> <option value="WPU">Publishers</option> <option value="WSE">Series</option> <option value="WSU">Subject words</option> <option value="WIB">ISBN</option> <option value="WIS">ISSN</option> <option value="WLN">Language</option> <option value="WYR">Year published</option> <option value="WCL">Collection code</option> <option value="WCK">Classmark</option> <option value="SYS">System number</option> <option value="BAR">Barcode</option> </select>
    </td>
  </tr>
  <tr>
    <td align="center" colspan="2"> <input type="submit" value="Search Library Catalogue" />
    </td>
  </tr> </tbody>
</table> <tags:hiddenoperationparam> </tags:hiddenoperationparam></form></w:populate>

All suggestions much appreciated!

Hey guys I have made search form on my site but how do i get it to search my site when the user clicks search.

Tried to find a tutorial on this but no luck.

HTML Code:

<form action="?" method="post" name="searchfield" id="searchfield">
          <p>Search the Web:
            <input name="search" type="text" class="search" size="15" />
              <input name="submit" type="submit" class="submit" value="Search" />
          </p>
      </form>

I know I have to create a script which I wold like to do in php but what do I add to the script

Hi there, quite a lame question i think..

Anyone have on idea on a script, (which i believe should be quite simple) which can extract the line from an csv file and show ot in a html page at search request.

In more details it should look like this :

somebody enters some word in simple html search form and pushes search button, the script searches through the csv file and copies whole line with matchin word in the web page.

Or maybe there is a simplier way, since csv file can be converter to any other format...

Thanks in advance.

Hi,

I am having a problem. I have a HTML table on my webpage but I am having trouble searching it from my main homepage using a HTML form.

The html form on the homepage is:

<html>
<body>
<form method="post" action="http://www.example.com/sites/default/files/html_table.html"
<input type="text" size="30" maxlength="1000" value="" id="textBoxSearch" onkeyup="tableSearch.search(event);" />
<input type="submit" value="Search" onclick="tableSearch.runSearch();" />
</body>
</html>

I have a search working fine on the html page and javascript functions conducting the search as shown he

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>JavaScript Search</title>
<style type="text/css">
body { font-family: Arial; font-size: 11px; }
td { font-family: Arial; font-size: 11px; }
th { font-family: Arial; font-size: 11px; background-color: #c8c8c8; }
input { font-family: Arial; font-size: 11px; }
</style>
<script language="javascript" type="text/javascript">
//define the table search as an object, which can implement both functions and properties
window.tableSearch = {};

//initialize the search, setup the current object
tableSearch.init = function() {
//define the properties I want on the tableSearch object
this.Rows = document.getElementById('data').getElementsByTagName('TR');
this.RowsLength = tableSearch.Rows.length;
this.RowsText = [];

//loop through the table and add the data to
for (var i = 0; i < tableSearch.RowsLength; i++) {
this.RowsText[i] = (tableSearch.Rows[i].innerText) ? tableSearch.Rows[i].innerText.toUpperCase() : tableSearch.Rows[i].textContent.toUpperCase();
}
}

//onlys shows the relevant rows as determined by the search string
tableSearch.runSearch = function() {
//get the search term
this.Term = document.getElementById('textBoxSearch').value.toUpperCase();

//loop through the rows and hide rows that do not match the search query
for (var i = 0, row; row = this.Rows[i], rowText = this.RowsText[i]; i++) {
row.style.display = ((rowText.indexOf(this.Term) != -1) || this.Term === '') ? '' : 'none';
}
}

//runs the search
tableSearch.search = function(e) {
//checks if the user pressed the enter key, and if they did then run the search
var keycode;
if (window.event) { keycode = window.event.keyCode; }
else if (e) { keycode = e.which; }
else { return false; }
if (keycode == 13) {
tableSearch.runSearch();
}
else { return false; }
}
</script>
</head>


<body onload="tableSearch.init();">
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<input type="text" size="30" maxlength="1000" value="" id="textBoxSearch" onkeyup="tableSearch.search(event);" />
<input type="button" value="Search" onclick="tableSearch.runSearch();" />
</td>
</tr>
</tbody>
</table>
<br />
<table border="1" cellpadding="2" cellspacing="0">
<tr>
<th>ID</th>
<th>First Name</th>
<th>Surname</th>
<th>Website</th>
</tr>
<tbody id="data">
<tr>
<td>1</td>
<td>Heathesh</td>
<td>Bhandari</td>
<td><a href="http://heathesh.com">http://heathesh.com</a></td>
</tr>
<tr>
<td>2</td>
<td>Candice</td>
<td>David</td>
<td><a href="http://candicedavid.com">http://candicedavid.com</a></td>
</tr>
</tbody>
</table>
</body>
</html>

If anybody could help me please! I have run out of ideas

Hello,

I am new to posting on HTMLforums.com. I have a quick question for someone that has a good understanding of HTML (and most likely JS).

On the front page of SWFL.cc I have a search box to the left. It is connected to the php search functionality in the Open-Realty Script. I would like to know if there is a way to get this functionality:

I have the Purchase/Rental drop down, and I would like to know if there is any way to change the price variables depending on the selection of the purchase/rental drop down.

If this is possible, could someone point me in the right direction to figure out how to go about doing this.

Thank You,

Brian Meyer

I am just getting back into html and im already having a few problems. I am making this website for my parents to help promote their new college and so far its look excellent except for the fact that I cant get this pesky search and dropdown list to align right.

www.xgenservers.com/CFC/2/index.htm

The site works perfectly in Mozilla Firefox, but I cannot get it to shape out right in Internet Explorer. I could really use a helping hand on this one, thanks a ton .

Hello

I have been asked by my manager to build our company website (www.cityends.com)

My enquiry is this, how do i use html to creat a form which can search the current properties we have. And how would i go about creating a database which this form is able to read

Any help is very much appreciated, i am very new to building websites, any comments on my current effort are also appreciated

Thanks

Mark

Hey all,

I'm pretty sure this is a very easy solution, I've just been staring at it too long and am probably missing the cause.

I'm using Google's site search API and using their "Results Only" setup, so I design my own search box, then just drop their code into the results page and specify the variable the query is being passed as. So here's my search box:

Code:

<form method="post" action="/search-results/?q=">    	
<input id="searchTxt" type="text" maxlength="128" name="q" size="15" value="Search" onfocus="if (this.value == 'Search') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search';}" />
<input type="image" name="op" value="Search" src="/wp-content/uploads/2011/07/search-button-magnifier.png" />

And the results code via Google:
Code:

<div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript"> 
  function parseQueryFromUrl () {
    var queryParamName = "q";
    var search = window.location.search.substr(1);
    var parts = search.split('&');
    for (var i = 0; i < parts.length; i++) {
      var keyvaluepair = parts[i].split('=');
      if (decodeURIComponent(keyvaluepair[0]) == queryParamName) {
        return decodeURIComponent(keyvaluepair[1].replace(/\+/g, ' '));
      }
    }
    return '';
  }
  google.load('search', '1', {language : 'en'});
  google.setOnLoadCallback(function() {
    var customSearchControl = new google.search.CustomSearchControl('XXXXXXXXXXXXXXXXXXX');
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
    var options = new google.search.DrawOptions();
    options.enableSearchResultsOnly();     
    customSearchControl.draw('cse', options);
    var queryFromUrl = parseQueryFromUrl();
    if (queryFromUrl) {
      customSearchControl.execute(queryFromUrl);
    }
  }, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />

But nothing seemingly the query is not sent with the user to the results page. Manually adding "?q=test" shows the results work. Am I missing something here? I'm using Wordpress on this site, so not sure if the permalink setup is screwing with it at all.

Thanks for the help

hi everyone,

ok heres my problem that is bugging me. I have a ecommerce website that im setting up and it comes with a default search feature.
Code:

<form name="quick_find" action="MYDOMAIN/index.php?main_page=advanced_search_result" method="get">
<input type="hidden" name="main_page" value="advanced_search_result" />
<input type="hidden" name="search_in_description" value="1" />
<input type="text" name="keyword" size="18" maxlength="100" style="width: 103px; margin-right:5px; vertical-align:middle;" value="" onfocus="if (this.value == 'Enter search keywords here') this.value = '';" />
<input type="submit" value="Search" style="width: 50px; vertical-align:middle;" />
</form>

on my site i sell music LP's and each lp has in its description the year it was released.

If i was to put in the above form "1996" it would search all my products and return any that have "1996" in their desctiption.

With this in mind i would like to create a form that had 4 drop down boxes. day,month,year,country

I have created the following code below;

Code:

<form name="quick_find_header" action="MYDOMAIN/index.php?main_page=advanced_search_result" method="get">
<input type="hidden" name="main_page" value="advanced_search_result" />
<input type="hidden" name="search_in_description" value="1" /> 
<select name="keyword">
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option selected value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>

</select>
<select name="keyword">

<option value="01">Jan</option>
<option value="02">Feb</option>
<option value="03">Mar</option>
<option value="04">Apr</option>
<option value="05">May</option>
<option value="06">Jun</option>
<option selected value="07">Jul</option>
<option value="08">Aug</option>
<option value="09">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>

</select>
<select name="keyword">

<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option selected value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>

<input type="image" src="includes/templates/theme013/buttons/english/button_search.gif" alt="Search" title=" Search " style="margin-left:1px;" /> </form>

this gives me 3 drop down box's (YEAR,MONTH,DAY)

The problem is when i click search it only searches for the year. instead of combining all the selected data (e.g. 1996+JUN+23) it just searched for 1996.

The second problem is if someone managed to get this form to work, would it search for "1996JUN23" or "1996 JUN 23". The reason i ask this is my products descriptions say "this single was released on 23 June 1996"

I hope ive made all the above clear!!

Any help would be greatly appreciated.

thanks in advance

I'm a noob so please forgive me if this is a stupid question or if the info is listed somewhere else. I really did try and find it on my own.

I'm trying to make a simple website that incorporates amazon's free "astore". It has a search function included in the sidebar already but i don't like it and really want to set up my own.

I found this search box code:
Quote:
<form action="http://astore.amazon.com/adbabel-20/search" method="get" target="_blank">
<input name="node" value="8" type="hidden">
<input name="keywords" size="12" value="" type="text">
<button type="submit" >Search</button>
</form>
it works well but is limited to searching only one category in my store (i have several). each category is assigned a "node" number. By changing the node value in the code I can change which category the box searches.

I want to create a drop down list that, upon selection, changes the node value and thus the category that is to be searched. Can anyone let me know how this might be done?

I have been trying this all day all I get is the easy %50 done... and I can't figure out the second form.

I want the first button to use the entire form to register, and it does..

I want the second button, to just take the first input field, throw the text in there at the end of a specific url, and bring me to that page.

Why is this so hard?
HTML Code:

<form name="trnyjump" method="post">
<input type="hidden" value="ppg" name="path"><input type="hidden" value="1" name="readrules">
<table width="220" border="0" align="center">
<TR BGCOLOR="#000000"><TD colspan="2" ALIGN="LEFT"><FONT FACE="TAHOMA" SIZE="2" COLOR="#FFFFFF">ENTER TOURNEY</FONT></TD></TR>
<TR BGCOLOR="#000000"><TD WIDTH="40%" ALIGN="LEFT"><FONT FACE="TAHOMA" SIZE="2" COLOR="#FFFFFF">JUMP = </FONT></TD><TD WIDTH="60%" ALIGN="LEFT"><input type="text" SIZE="10" name="tcount" value=""></TD></TR>
<TR BGCOLOR="#000000"><TD WIDTH="40%" ALIGN="LEFT"><FONT FACE="TAHOMA" SIZE="2" COLOR="#FFFFFF">NAME = </FONT></TD><TD WIDTH="60%" ALIGN="LEFT"><input type="text" name="name" SIZE="10" value=""></TD></TR>
<TR BGCOLOR="#000000"><TD WIDTH="40%" ALIGN="LEFT"><FONT FACE="TAHOMA" SIZE="2" COLOR="#FFFFFF">PASSWORD = </FONT></TD><TD WIDTH="60%" ALIGN="LEFT"><input type="password" name="playerpass" SIZE="10" value=""></TD></TR>
<TR><TD WIDTH="100%" colspan="2" ALIGN="LEFT">
<!-- mmmmm buttons -->
<INPUT type="button" value="Register" name=Register onclick="return OnRegister();">
<INPUT type="button" value="View" name=View onSubmit="return OnView" action="/">

</form> 
</TD></Tr>
<script language="Javascript">
function OnRegister()
{
    document.trnyjump.action = "http://cgi4.igl.net/tourneysystem/register.php"
    document.trnyjump.target = "_blank";    // Open in a new window
    document.trnyjump.submit();             // Submit the page
    return true;
}
</script>
<script>
function OnView 
{
	 document.trnyjump.action = ("http://cgi4.igl.net/tourney/ppg/" +form.tcount.value+ "/");
	 document.trnyjump.action = "_blank";
	 document.trnyjump.submit();
 return true;
}
</script>

I have also tried this for the second button... HTML Code:

<script>
function Ontcount(form) {
  if (form.trn.value) {
    var OpenWindow=window.open ("http://cgi4.igl.net/tourney/ppg/" +form.trn.value+ "/");
  }
  return false;
}
</script>

These may not look like they work right now because I have changed them so much thay may not be exactly what I am using... is there anybody here who can tell me how to get this to work.

Hi there

I checked through a bunch of this forum but I can't find anything
on this topic. If it's already been addressed, I'd be thankful if you could point me to the thread. If not, this is my problem....

I need to have 2 drop down menus in the same form, so that
when the user clicks submit (OK in this case) both selected fields
are posted....



Code:

<form method="post" action="show.html"> 
<table>
   <tr>
      <td>Select a color</td>
      <td><select name=color">
                 <option value="red">red</option>
                 <option value="green">green</option>
                 <option value="yellow">yellow</option>
                 <option value="orange">orange</option>
                 <option value="purple">purple</option>
                 <option value="blue">blue</option>
              </select>
      </td>
   </tr>
   <tr>
      <td>Select a shape</td>
      <td><select name=shape">
                 <option value="circle">circle</option>
                 <option value="square">square</option>
                 <option value="triangle">triangle</option>
                 <option value="hexagon">hexagon</option>
              </select>
      </td>
   </tr>
   <tr>
      <td><input type="submit" value=" OK "></td>
   </tr>
</table>
</form>

This code displays the drop downs perfectly but only the color
is being posted to show.html

It's something small but I can't figure this one out.

I'm not sure if you can even have 2 drop downs with 1 submit button.

Any and all assistance is greatly appreciated!

Perkie