使用jQuery Ajax和PHPjQuery、Ajax、PHP

2023-09-10 19:52:28 作者:妄生

我有code这是writen在JavaScript阿贾克斯,我想转让相同的code到jQuery的。

I have code which is writen in javascript ajax and I like to transfer same code into jquery.

这是我的JavaScript的Ajax code。

This is my javascript Ajax code.

function cascadeCountry(value) {
   if (document.getElementById("stateprovince_auto") != null) {
    if (value != '') {
        http.open('get', url+'cascade/cascade_sign.php?a=country&v=' + value );
        document.getElementById('stateprovince_auto').innerHTML = "  " + loadingTag;
        http.onreadystatechange = handleResponse;
        http.send(null);
    }
    //alert( value );
   }
}

我的PHP code。

My php code.

case 'country':
        echo '|||stateprovince_auto|:|' . stateOptions()
            . '|||county_auto|:|' . '<input name="txtcounty" type="text" size="30" maxlength="100" />'
            . '|||city_auto|:|' . '<input name="txtcity" type="text" size="30" maxlength="100" />';
            //. '|||txtzip|:|' . '<input name="txtzip" type="text" size="30" maxlength="100" />';
        break;

function stateOptions() {
    $state = new StateProvince();
    $data = $state->get_stateOptions( trim($_GET['v']), 'Y' );

    if (count($data) < 1) 
        return '<input name="txtstateprovince" type="text" size="30" maxlength="100" />';

      $ret .= ' <select class="select" name="txtstateprovince" onchange="javascript: cascadeState(this.value, this.form.txt_country.value,\'txtcounty\');" >';

    $ret .= '<option value="">'.format_lang('select_text').'</option>';

    foreach ($data as $k => $y) {
        if ($k!='AA') {
            $ret .= "<option value='$k'>$y</option>";
        }
    }
    unset ($data);

    return $ret .= '</select>';
}

我的旧的HTML code。

My old HTML code.

<tr>
    <td><img src="{$skin_images_path}required.gif" alt="" /></td>
    <td><span class="label">{lang mkey='label' skey='country' }</span></td>
    <td>

    <select name="txt_country" id="txt_country" onchange="javascript: cascadeCountry(this.value,'txtstateprovince');" >
        {html_options options=$country selected=$smarty.session.loc.country}
    </select>
     </td>
</tr>

<tr>
    <td>&nbsp;</td>
    <td><span class="label">{lang mkey='label' skey='state'  }</span></td>
    <td>
        <div id="stateprovince_auto">

        {if $lang.states|@count > 0}
            <select class="select" name="txtstateprovince" onchange="javascript: cascadeState(this.value, this.form.txt_country.value,'txtcounty');" >
            {html_options options=$lang.states selected=$smarty.session.loc.stateprovince}
            </select>
        { else }
            <input class="text_field required" name="txtstateprovince" type="text" size="30" maxlength="100" value="{$smarty.session.loc.stateprovince}" />
       { /if}                
        </div>
      </td>
</tr>

<tr>
    <td>&nbsp;</td>
    <td><span class="label">{lang mkey='label' skey='county'  }</span></td>
    <td>
        <div id="county_auto">

          { if $lang.counties|@count > 0}
            <select class="select" name="txtcounty" onchange="javascript: cascadeCounty(this.value,this.form.txt_country.value, this.form.txtstateprovince.value,'txtcity');" >
            {html_options options=$lang.counties selected=$smarty.session.loc.countycode}
            </select>
          { else }
            <input name="txtcounty" type="text" size="30" maxlength="100" value="{$smarty.session.loc.countycode}" />
          { /if}

        </div>
    </td>
</tr>

<tr>
    <td>&nbsp;</td>
    <td><span class="label">{lang mkey='label' skey='city' }</span></td>
    <td>
        <div id="city_auto">
          { if $lang.cities|@count > 0}
            <select class="select" name="txtcity" >
              {html_options options=$lang.cities selected=$smarty.session.loc.citycode}
            </select>
          { else }
            <input name="txtcity" type="text" size="30" maxlength="100" value="{$smarty.session.loc.citycode}" />
          { /if}

        </div>
    </td>
</tr>

这是我的新的jQuery的Ajax code。

This is my new Jquery Ajax code.

$(document).ready(function()
    {   
          /**country **/
          $("#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);}
            });
          });
 });

我的新的PHP code。

My new PHP code.

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

        echo '|||county_auto|:|' . '<input name="txt_region" id="txt_region" type="text" size="30" maxlength="100" />&nbsp;&nbsp;';
    }

我的新的HTML code。

My new HTML code.

<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>

我的问题是,与旧的code当我选择不同的国家,它会清除州和县的数据,但与C中的状态我的新$ C $被清除,但不是县。

My question is that with old code when i select different country it clears states and county data but with my new code the states gets cleared but not the county.

是否有人可以让我知道我在做什么错在这里。

Can someone please let me know what i'm doing wrong here.

推荐答案

是的,只有状态得到清除,因为你告诉它这样做以下行:

yes, only the states get cleared because you tell it to do so in the following line:

$("#countrystates").html(html);