How to display hidden value in form based on selection?

Question

I'm using a custom search where I have a dropdown:

<select name='Time_Available'>
            <option value="" selected='true'>Any</option>
            <option value='<?php echo date('Y/m/d', strtotime('+30 days')) ?>'>30 days</option>
            <option value='<?php echo date('Y/m/d', strtotime('+60 days')) ?>'>60 days</option>
            <option value='<?php echo date('Y/m/d', strtotime('+90 days')) ?>'>90 days</option>
            </select>

Although, when the form is submitted, if the "Any" option is selected, I would like it to add this to the form:

<input type='hidden' name='Model' value='Yes' />

For the rest of the options (30, 60, 90 days) I just want it to submit regularly without the above part.

I was trying to work around this by adding &Model=Yes to the value of "Any" although the ampersand gets screwed up. Is there any javascript or jQuery I can add to resolve this?

Answer 1

It's not difficult.

Add the hidden-input to the form and modify the select into this:

<select name='Time_Available' onchange="this.form.Model.disabled=(this.options.selectedIndex)? true:false">

If the selected option changes, and the new selected option is not the first one, the get's disabled.

Answer 2

jQuery can do this in five seconds. There are some more complicated ways to have the input added to the page, but I highly recommend you just put it there in the HTML without JS intervention:

<input id="Model" type="hidden" name="Model" value="Yes" disabled="disabled" />

Then you just do this.

$("select").change(function () {
   if ($(this).val() == 'Any') {
      $("#Model").attr('disabled', '');
   }
   else {
      $("#Model").attr('disabled, 'disabled');
   }
});

Note that if "Any" is selected by default, you don't want to disable Model initially for obvious reasons.

By the way, I'm a little confused as to why you need an additional check if you are already checking the value of the select. Instead of your script checking Model == Yes, why not just check Time_Available == Any?

Finally, you cannot append to the query string in the way you describe (just adding & to values like that is not going to work). The ampersand will be encoded automatically. If users could just add whatever they felt like to the query string in such a way it would be a UI nightmare.