2017-07-29 84 views
3

我在地址表单输入上具有自动完成功能。当用户点击该建议时,状态和邮政编码信息被自动填充。 cp_state是带有状态名称下拉列表的选择框,而 cp_zipcode是邮政编码的输入文本。更改受jquery.selectBox插件影响的表单选择框的值

我使用下面的JavaScript代码来执行更新值和禁用它的任务。

$('#cp_zipcode').val(data.postcode); 
document.getElementById("cp_zipcode").value = data.postcode; 
document.getElementById("cp_zipcode").disabled=true; 

document.getElementById("cp_state").value = data.state; 
$('#cp_state').val(data.state); 
$('#cp_state').change(); 
document.getElementById("cp_state").disabled=true; 

上面的代码适用于哪个,只要用户选择一个地址,邮编的填充和残疾人避免修改,unfortunaley它并不适用于国家选择框工作,不知道为什么,但我认为,邮政编码输入可能是jquery.selectBox.min.js?ver = 1.2.0插件正在影响任务,因为它会自动隐藏cp_state选择框并添加新的样式,但不知道它在做什么。

Firebug output

HTML表单字段的

<input value="" name="cp_address" id="cp_address" type="text" class="text" placeholder="" /> 

<select name="cp_state" id="cp_state" class="dropdownlist required"> 
    <option value="">-- Select --</option> 
    <option value="All State">All State</option> 
    <option value="Johor">Johor</option> 
    <option value="Kedah">Kedah</option> 
    <option value="Kelantan">Kelantan</option> 
    <option value="Wilayah Persekutuan Kuala Lumpur">Wilayah Persekutuan Kuala Lumpur</option> 
    <option value="Wilayah Persekutuan Labuan">Wilayah Persekutuan Labuan</option> 
    <option value="Melaka">Melaka</option> 
    <option value="Negeri Sembilan">Negeri Sembilan</option> 
    <option value="Pahang">Pahang</option> 
    <option value="Wilayah Persekutuan Putra Jaya">Wilayah Persekutuan Putra Jaya</option> 
    <option value="Perlis">Perlis</option> 
    <option value="Pulau Pinang">Pulau Pinang</option> 
    <option value="Perak">Perak</option> 
    <option value="Sabah">Sabah</option> 
    <option value="Selangor">Selangor</option> 
    <option value="Sarawak">Sarawak</option> 
    <option value="Terengganu">Terengganu</option> 
</select> 

<input value="57000" name="cp_zipcode" id="cp_zipcode" type="text" class="text" placeholder="Enter zipcode" /> 

有人能解决这个问题,我需要自动完成选择后自动改变选择框的值。我会很感激你的帮助。

回答

1

jquery selectBox将自动隐藏您的select元素并创建a列表作为显示。用

替换上面的代码
$('#cp_zipcode').val(data.postcode); 
$('#cp_zipcode').attr('disabled', true); 

// set value 
$('#cp_state').selectBox('value', data.state); 

// 'enable' or 'disable` control 
$('#cp_state').selectBox('disable'); 
+0

它的工作!我按照您的建议更改了代码,选择框在选择自动完成地址时填充了状态名称,并禁用了该选项以防止用户修改。谢谢,我感谢你的帮助:) – Ibrahim