我提出了这个问题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> </td>
</tr>
{if $allow_country_state == 1 }
<tr>
<td> </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> </td>
</tr>
{/if}
<tr>
<td> </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> </td>
</tr>
答案 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();
}
});
}