div没有被jquery更新

时间:2013-06-01 21:09:51

标签: php javascript jquery html ajax

我提出了这个问题Using Jquery Ajax with PHP,这是一个解决的问题。

我有另一个问题。

当页面加载时,我选择英国作为默认国家/地区,当我选择州更新县时,但当我将国家/地区更改为美国州时,下拉列表会更新,但是当我从下拉框中选择州时,县不会更新。

Jquery Ajax代码。

 $(document).ready(function()
        {   
              $("#txt_country").change( getCountryStates );

          function getCountryStates()
          {
            var country = $("#txt_country").val();
            var dataString = 'country='+ country+"&a=s";
            $("#countrystates").html( retrieving );
            $.ajax({
                type: "POST",
                url: url+"/OPJB_cascade/location.php",
                data: dataString,
                cache: false,
                success: function(html){$("#countrystates").html(html);}
            });
            $("#countryregion").html('<input type="text" id="txt_region" name="txt_region" size="30" class="textField" value="" maxlength="100" />');
          }

     $("#txt_states").change(getCountryCounty);
             //$("#txt_states").bind("onchange", getCountryCounty);

              function getCountryCounty()
              {
                var states  = $("#txt_states").val();
                var country = $("#txt_country").val();
                alert(states );
                var dataString = 'country='+country+'&states='+ states+"&a=r";
                $("#countryregion").html('Retrieving ...');
                $.ajax({
                  type: "POST",
                  url: url+"/OPJB_cascade/location.php",
                  data: dataString,
                  cache: false,
                  success: function(html){$("#countryregion").html(html);}
                });
              }
});

PHP代码。

 $action = $_REQUEST['a'];

        if( allow_country_state == 1 )
            $states = $_REQUEST['states'];

        if($action == 's' )
        {
            if( allow_country_state == 1)
            {
                $countryStates = CountryStates::getStates($country);
                if( $countryStates )
                {
                    $select =  '<select class="selectField" name="txt_states" id="txt_states" style="width:200px;">';
                    $select .= '<option></option>';
                    foreach ($countryStates as $r )
                    {
                        $select .= '<option value="'.$r->code.'">'.$r->name.'</option>';    
                    }
                    $select .= '</select>';
                }
                else
                {
                    $select = '<input type="text" id="txt_states" name="txt_states" style="width:200px;" class="textField" maxlength="100" />';
                }

                echo $select;
            }
        }
        elseif($action == 'r')
        {
            //include_once OPJB_LIB_PATH.DS.'class.countrycounty.php';
            $CountryCounty = CountryCounty::getCounties($country, $states);
            if( $CountryCounty )
            {
                $select = '<select class="selectField" name="txt_region" id="txt_region" style="width:200px;">';
                $select .= '<option></option>';
                foreach ($CountryCounty as $r )
                {
                    $select .= '<option value="'.$r->code.'">'.$r->name.'</option>';    
                }
                $select .= '</select>';
            }
            else
            {
                $select = '<input type="text" id="txt_region" name="txt_region" style="width:200px;" class="textField" maxlength="100" />';
            }

            echo $select;
        }

HTML代码。

<tr>
      <td> <label class="required_star">*</label> </td>
      <td> <label>{lang mkey='label' skey='country'}</label> </td>
      <td>
        <select name="txt_country" id="txt_country" class="selectField">
          {html_options options=$country selected=$smarty.session.loc.country}
        </select>
      </td>
      <td>&nbsp;</td>
    </tr>

    {if $allow_country_state == 1 }
        <tr>
          <td>&nbsp;</td>
          <td> <label>{lang mkey='label' skey='countryStates'}</label> </td>
          <td>
            <div id="countrystates">
             {if $countryStates|@count > 0}
                <select class="selectField" name="txt_states" id="txt_states">
                  {html_options options=$countryStates selected=$smarty.session.loc.countrystates}
                </select>
             {else}
                <input type="text" id="txt_states" name="txt_states" size="30" class="textField" value="{$smarty.session.loc.countrystates}" maxlength="100" />
             {/if}
            </div>
            </td>
          <td>&nbsp;</td>
        </tr>
    {/if}
    <tr>
      <td>&nbsp;</td>
      <td> <label>{lang mkey='label' skey='region'}</label> </td>
      <td>
        <div id="countryregion">
         {if $CountryCounty|@count > 0}
            <select class="selectField" name="txt_region" id="txt_region">
              {html_options options=$CountryCounty selected=$smarty.session.loc.countryregion}
            </select>
         {else}
            <input type="text" id="txt_region" name="txt_region" size="30" class="textField" value="{$smarty.session.loc.countryregion}" maxlength="100" />
         {/if}
        </div>
        </td>
      <td>&nbsp;</td>
    </tr>

1 个答案:

答案 0 :(得分:1)

从后端收到数据后,您必须重新绑定您替换的国家/地区div。

function bindCountry() {
    $("#txt_country").change(function(){
        var country=$(this).val();
        var dataString = 'country='+ country+"&a=s";
        $("#countrystates").html( retrieving );
        $.ajax({
            type: "POST",
            url: url+"/OPJB_cascade/location.php",
            data: dataString,
            cache: false,
            success: function(html){$("#countrystates").html(html);}
        });
    });  
}



$(document).ready(function() {   
    bindCountry();          
 });

$("#txt_states").change(getCountryCounty);

function getCountryCounty() {
    var states  = $("#txt_states").val();
    var country = $("#txt_country").val();
    alert(states);
    var dataString = 'country='+country+'&states='+ states+"&a=r";
    $("#countryregion").html('Retrieving ...');
    $.ajax({
        type: "POST",
        url: url+"/OPJB_cascade/location.php",
        data: dataString,
        cache: false,
        success: function(html){
            $("#countryregion").html(html);
            // Notice we rebind the country
            bindCountry();
        }
    });
}