jQuery change/bind event

Associate
Joined
28 May 2008
Posts
346
I am working on an online form and there are 2 fields at different stages of the form that appear as dropdowns. Both have Yes/No options with underlying Y/N values. Basically what I want to do is add code using javascript or jQuery so that when I chose "Yes" on the first drop down it will set the option of the 2nd drop down to "Yes" also. The two fieldnames are "applicant.address" and "applicant_2"

Researching on this I found various ideas using the jQuery bind/change events and one piece of code I tried was...

Code:
$("applicant.address").bind("change", applicant_2);

also tried wrapping a div round the first field but no luck, not sure if a div structure is required here?

but truthfully even if this code was along the right lines i'm not experienced enough to know how to change things up to make this work.

Any help greatly appreciated :)
 
Couple of issues with your code. Firstly, you have just set your selector as 'applicant.address' this means jQuery will be looking for an element like this: <applicant class="address" /> which obvioulsy isn't going to work. Secondly the dot in the id of the element is not very good practice, although not a show-stopper, and means you'll need to use the escape character in the selector so that jQuery doesn't think you're looking for something with a class of 'address'.

Try this:

Code:
$(function() {
    $("#applicant\\.address").bind("change", function() {
        // Made some assumptions here about how your HTML is structured, but this is a gist of what you'd need...
        if ($(this).val() == "Y") {
            $("#applicant_2").val("Y");
        } 
    });
});
 
Couple of issues with your code. Firstly, you have just set your selector as 'applicant.address' this means jQuery will be looking for an element like this: <applicant class="address" /> which obvioulsy isn't going to work. Secondly the dot in the id of the element is not very good practice, although not a show-stopper, and means you'll need to use the escape character in the selector so that jQuery doesn't think you're looking for something with a class of 'address'.

Try this:

Code:
$(function() {
    $("#applicant\\.address").bind("change", function() {
        // Made some assumptions here about how your HTML is structured, but this is a gist of what you'd need...
        if ($(this).val() == "Y") {
            $("#applicant_2").val("Y");
        } 
    });
});

Thanks for the tips and code! Will take note of the . escaping mechanics :)

Still can't seem to get it working, is starting a variable with # not applying it is a DIV rather than a field name?
 
the # prefix on a selector means that it's looking for something with that ID.

Could you post the HTML you have, and I could write something a bit more tailored to what you've got now.
 
Back
Top Bottom