Form output “values” are not correct?

Question

This is in relation to a previous question (DIV "hiding" when changing dropdown value) that helped me fix one part of the problem but I now have 2 problems to fix and finalise this form.

1. If I don't add a Guest Ticket, there is no need for the Payment Method - the div containing these fields is currently just hidden but how do I remove the mandatory component if no payment is required?

2. The Guest Ticket values are numbered from 0-10 so now when the form is submitted with "NONE" on Guest Tickets, the email displaying the form submission is indicating Guest = 1 because None has a value of 1.

Here is the latest JSFIDDLE = http://jsfiddle.net/4REan/1/

A snippet of the HMTL is here:

        <div class="clear">
        <label for="CAT_Custom_266143">Member Tickets: <span class="req">*</span></label>
        <select style="width: 120px;" name="CAT_Custom_266143" id="CAT_Custom_266143" class="cat_dropdown">
        <option value=" ">-- Please select --</option>
        <option value="None">NONE</option>
        <option value="1 Ticket">1 Ticket = $0</option>
        <option value="2 Tickets">2 Tickets = $0</option>
        <option value="3 Tickets">3 Tickets = $0</option>
        <option value="4 Tickets">4 Tickets = $0</option>
        <option value="5 Tickets">5 Tickets = $0</option>
        <option value="6 Tickets">6 Tickets = $0</option>
        <option value="7 Tickets">7 Tickets = $0</option>
        <option value="8 Tickets">8 Tickets = $0</option>
        <option value="9 Tickets">9 Tickets = $0</option>
        <option value="10 Tickets">10 Tickets = $0</option>
        </select>
        <label for="CAT_Custom_266107">Guest Tickets: <span class="req">*</span></label>
        <select style="width: 120px;" name="CAT_Custom_266107" id="CAT_Custom_266107" class="cat_dropdown">
        <option value="0">-- Please select --</option>
        <option value="1">NONE</option>
        <option value="2">1 Ticket = $15</option>
        <option value="3">2 Tickets = $30</option>
        <option value="4">3 Tickets = $45</option>
        <option value="5">4 Tickets = $60</option>
        <option value="6">5 Tickets = $75</option>
        <option value="7">6 Tickets = $90</option>
        <option value="8">7 Tickets = $105</option>
        <option value="9">8 Tickets = $120</option>
        <option value="10">9 Tickets = $135</option>
        <option value="11">10 Tickets = $150</option>
        </select>
        </div>

I wanted to use "alphanumeric values" but not sure how to go about this, that is why the Members Tickets are different, there is no additional coed linking to this field.

Can I number the values "0" for NONE then "1-10" for the tickets so when submitted it reads correctly? I have tried this but without turning the mandatory selection off on the Payment Method first, I can't submit the form to make it work?

Answer 1

I think you should specify the value 0 for 'none' and 'please select option' . specify the value for tickets from 1-n and change the condition under toggle function of payment method to $('#payMethod').toggle($(this).val() >= 1); instead of value 2.

Note :I cant test the application as this requires submission of the form and thats not possible on jsfiddle. just try this once

Happy Coding :)