Jquery - switch && not working?

I am trying to control a hidden input value based on the value of 2 previous fields. I've had some success with a switch statement, but I just can't seem to get it to work exactly. What I would like to have happen is to test if a user entered CA or NV in the field #state, if they did, AND they selected the option value auto, the #ins_link value will change to CA or NV(respectively). What am I doing wrong here? Here is what I am working with:

<input class="statefield isstate" name="state" id="state" maxlength="2" onkeyup="this.value=this.value.toUpperCase();">

<select class="input_field_12em required" name="ins_type" id="ins_type">
                                            <option value="" selected="selected" >---Select Insurance Type---</option>

                    <option value="home">Home</option>
                    <option value="auto">Auto</option>
                    <option value="homeauto">Home + Auto</option>
                    <option 开发者_高级运维value="renter">Renter</option>
                    <option value="buildingowner">Building Owner</option>
                    <option value="dwellingfire">Dwelling Fire</option>
                    <option value="commercial">Commercial</option>
                    <option value="agricultural">Agricultural</option>
                </select>       


$(function() {
    $('#ins_type').change(function() {
        switch (this.value) {
           case 'auto':
           if ($("#state[CA]" && "#ins_type[auto]"))
              $(".ins_link").val("CA"); 
              break;
            case 'auto':
           if ($("#state[NV]" && "#ins_type[auto]"))
              $(".ins_link").val("NV"); 
           default :
              $(".ins_link").val("summary");
           break; 
        }
    });
});

<input type="hidden" class="link ins_link" value="summary">

---

The actual way to solve your problem would be

$(function () {
    $('#ins_type').change(function() {
        if (this.value === "auto") {
            var state = $("#state").val();

            if (state === "CA" || state === "NV") {
                $(".ins_link").val(state);
            } else {
                $(".ins_link").val("summary");
            }
        }
    });
});

Do you see how this code actually reflects your requirements?

• If #ins_type's value is "auto":
  • If #state's value is "CA" or "NV", set .ins_link's value to the state selected.
  • Otherwise, set .ins_link's value to "summary".

Your code structure should reflect your thought structure.

---

       if ($("#state[CA]" && "#ins_type[auto]"))

That's doing the logical AND of two strings, the result of which is then used as a selector for an element in your page. This will not work.

Your sample code doesn't show where/how you store the state information, but you'd want something more like this:

case 'auto':
    if ($('#state').val() == 'CA') {
        ... do california stuff ...
    }
    if ($('#state').val() == 'NV') {
        ... do nevada stuff ...
    }
    break;

Checking for the 'auto' selection again within the inner if() is redundant, as you've already forced it to be 'auto' with the switch().

---

You have some misunderstandings of how JavaScript and jQuery work here.

"#state[CA]" is just a string, as is "#ins_type[auto]"

"#state[CA]" && "#ins_type[auto]" converts those strings to bools, then asks if they are both true. Only the empty string converts to false, so the logic is:

"#state[CA]" && "#ins_type[auto]" === true && true === true

Then you are wrapping that with a $ function call, which just converts its arguments to a jQuery object. So

$("#state[CA]" && "#ins_type[auto]") === $(true) = $()

i.e. you just got the empty jQuery object, since you didn't pass a selector or a DOM element.

If you test any non-null, non-undefined object with if, it converts it to bool, so you get if(true):

    if ($("#state[CA]" && "#ins_type[auto]"))
<=> if ($())
<=> if (true)

The same logic applies to your second if statement, so both if statements do nothing.