CodingForums.com - Inserting Selected Option Values into a Search URL

CodingForums.com (http://www.codingforums.com/index.php)

- JavaScript programming (http://www.codingforums.com/forumdisplay.php?f=2)

- - Inserting Selected Option Values into a Search URL (http://www.codingforums.com/showthread.php?t=286530)

Inserting Selected Option Values into a Search URL

I'm trying to inject the selected value from these select options into an overall search URL... I'm breaking URL up and adding the query items from each select into the center.

What is wrong with the way I'm doing it? It's not working correctly....

Code:

<form name="redlinesearch">

<select name="redline_inches" id="redline_inches">

<option value="14x+">14"</option>

<option value="15x+">15"</option>

<option value="16x+">16"</option>

<option value="17x+">17"</option>

<option value="18x+">18"</option>

<option value="20x+">20"</option>

<option value="22x+">22"</option>

<option value="24x+">24"</option>

<option value="26x+">26"</option>

<option value="28x+">28"</option>

<option value="30x+">30"</option>

</select>



<select name="redline_boltpattern" id="redline_boltpattern">

<option value="4-100">4-100</option>

<option value="4-108">4-108</option>

<option value="4-114.3">4-114.3</option>

<option value="5-100">5-100</option>

<option value="5-108">5-108</option>

<option value="5-110">5-110</option>

<option value="5-112">5-112</option>

<option value="5-114.3">5-114.3</option>

<option value="5-115">5-115</option>

<option value="5-120">5-120</option>

<option value="5-127">5-127</option>

<option value="5-135">5-135</option>

<option value="5-139.7">5-139.7</option>

<option value="5-150">5-150</option>

<option value="6-127">6-127</option>

<option value="6-135">6-135</option>

<option value="6-139.7">6-139.7</option>

<option value="8-165">8-165</option>

<option value="8-170">8-170</option>

</select>





<input type="submit" value="Search Now" onClick="location.href='http://www.redlinewheel.com/index.php?search_performed=Y&match=all&q='+redline_inches.options[selectedIndex].value+'+'+redline_boltpattern.options[selectedIndex].value+'+'&pname=N&pfull=Y&cid=0&pcode=&price_from=&price_to=&weight_from=&weight_to=&dispatch[products.search]=Search'" />



</form>

You aren't "escaping" the values. So, for example, if you put the value "30x+" into the URL, that + is seen as space character. *ALL* + signs are seen as spaces: It is one of the accepted encodings of space (the other is %20). If you want a real + sign, you must encode it.

On top of that, because you are using a SUBMIT button, the *NORMAL* action of the <form> is *STILL* performed. So very likely the normal submit action wipes out your location.href.

But I have to ask: *WHY* do it this way??? What's wrong with just using HTML and getting the JavaScript OUT OF THE WAY!!!

Why not simply:

Code:

<form action="http://www.redlinewheel.com/index.php" method="get">

<input type="hidden" name="pname" value="N"/>

<input type="hidden" name="pfull" value="Y" />

<input type="hidden" name="cid" value="0" />

<input type="hidden" name="pcode=" value="" />

<input type="hidden" name="price_from=" value="" />

<input type="hidden" name="price_to=" value="" />

<input type="hidden" name="weight_from=" value="" />

<input type="hidden" name="weight_to=" value="" />

<input type="hidden" name="dispatch[products.search]" value="Search" />

<input type="hidden" name="q"/>

<select name="redline_inches"> ... </select>

<select name="redline_boltpattern"> ... </select>

<input type="submit" value="search now" 

       onclick="this.form.q.value = this.form.redline_inches.value + "+" + this.form.redline_boltpattern.value;" />

</form>

Let the browsers normal form submit do all the work of making the correct "escapes" for you.