Forum Moderators: open

Message Too Old, No Replies

Populate hidden field with multiple selections?

Populate hidden field with multiple selections

         

MeestorMac

2:21 pm on Nov 21, 2009 (gmt 0)

10+ Year Member



Hi,

Could do with a little help before either my skull or desk gives up through the repeated banging of said skull against said desk!

Basically I have a site built on Expression Engine but because of the limits with the built in search function I need to expand it and I was hoping javascript would be the way forward.

The search consists of several drop down menus which are populated by custom sql queries, I need to be able to then populate a hidden "keywords" field so the EE search can then do its job.

I'm not a JS god and nor do I claim to be, hopefully one of the experts on here could point me in the right direction.

Here is a sample of the html:


{exp:search:simple_form search_in="everywhere" where="any" show_expired="yes" show_future_entries="yes" result_page="search/product-results" no_result_page="search/no-product-results}
<tr>
<td>
<label for="manufacturer">Manufacturer:</label>&nbsp;
</td>
<td>
<select id='key_1' name='key_1'>
{exp:query sql="SELECT DISTINCT `field_id_9` AS `product_manufacturer` FROM `exp_weblog_data` WHERE `field_id_9` IS NOT NULL"}
<option value="{product_manufacturer}">{product_manufacturer}</option>
{/exp:query}
</select>
</td>
</tr>
<tr>
<td>
<label for="fueltype">Fuel Type:</label>&nbsp;
</td>
<td>
<select name="key_2">
{exp:query sql="SELECT DISTINCT `field_id_15` AS `product_fuel_type` FROM `exp_weblog_data` WHERE `field_id_15` IS NOT NULL"}
<option value="{product_fuel_type}">{product_fuel_type}</option>
{/exp:query}
</select>
</td>
</tr>
<p><input name="keywords" id="keywords" value="" type="text"></p>
<p><input type="submit" value="Find My Fire" class="submit" /></p>
{/exp:search:simple_form}

And here is the JS which I thought would work but sadly does not:


function side-search () {
var manu = document.getElementById('key_1');
var type = document.getElementById('key_2');
var searchfield = manu.options[manu.selectedIndex].value +
type.options[type.selectedIndex].value;
document.getElementById('keywords').value=searchfield;
alert(document.getElementById('keywords').value);
});

Any help would be much appreciated.

Thanks
Steve

Fotiman

2:40 pm on Nov 23, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Your function looks ok, but I don't see it attached to any events. That is, presumably you would attach this to the form's onsubmit event handler. Note also that you probably want to add a space between the manu and type values when you assign them to searchfield.

When you say it doesn't work, what exactly DOES happen? Do you see the alert? Also note, the code above isn't actually the HTML output since it includes {exp:...}. To see the HTML output, do a view source on the page in your web browser. That might provide more clues (like, for example, your side-search function might not be attached to the form's onsubmit handler).