How to NOT pass 'Other' option for SELECT
How can I NOT pass anything from a SELECT when "Other" is selected? Selecting "Other" opens a separate text field that'll pass the answer when the form is submitted?
FORM CODE
- <div class="form-group">
- <label for="fruit" class="control-label">If you were a fruit, you'd be a(n).../label>
- <select id="fruit" name="fruit" data-value="fruit" class="form-control">
- <option value="" selected>-- Please Select --</option>
- <option value="Apple">Apple</option>
- <option value="Blueberry">Blueberry</option>
- <option value="Orange">Orange</option>
- <option value="Watermelon">Watermelon</option>
- <option value="">Other</option>
- </select>
- <div id="fruitContainer" class="form-group">
- <input name="fruit" type="text" class="form-control" id="fruit">
- </div>
- </div>
CSS
- #fruitContainer {
- display:none;
- }
jQuery
- $(function(){
- $("#fruit").change(function(){
- $("#fruitContainer").toggle(this.checked)
- })
- })