.change only works once

Discussion in 'jQuery' started by rulo4, Nov 15, 2011.

  1. #1
    Using php, mysql and jquery I retrieve countries from a database and fill a select.
    When user change the country select, another select (state) should change, filling with states of selected country.

    The problem is that the .change event only works when the page load, i.e. within .ready

    Why? Thanks!

    $(document).ready(function(){
        formAccordion();
        fillCountrySelect();
        ("#paisI").bind('change', fillStatesSelect());
    });
    
    function formAccordion(){
        $("#formReg").accordion({header: "h3", autoHeight: false});
    }
    
    function fillCountrySelect(){
        $.ajax({
            url: 'locationCountry.php',
            type: "GET",
            success: function(paises){
                $("#paisI").html(paises);
            }
        });
    }
    
    function fillStatesSelect(){
        alert("Me llamaste!");
        var pais = $("#paisI").attr('value');
        $.ajax({
            url: 'locationState.php',
            type: "GET",
            data: "submit=&pais="+pais,
            success: function(estados){
                $("#estadoI").html(estados);
            }
        });
    }
    
    
    Code (markup):
    I'm sure there's no problem with php files because when the page is ready, first select is filled with countries and the second select is filled with states of Afghanistan (first country).
     
    rulo4, Nov 15, 2011 IP
  2. Rukbat

    Rukbat Well-Known Member

    Messages:
    2,908
    Likes Received:
    37
    Best Answers:
    51
    Trophy Points:
    125
    #2
    $(document).ready(function(){
        formAccordion();
        fillCountrySelect();
        [B][COLOR=#ff0000][U]$[/U][/COLOR][/B]("#paisI").bind('change', fillStatesSelect());
    });
    
    Code (markup):
    #paisI's change never got bound to fillStatesSelect
     
    Rukbat, Dec 1, 2011 IP