[英]How to update multiple form elements with ajax call
在通過jQuery成功調用ajax之后,我需要更新div表單。 我的頁面上有一些表單元素。 我想用從ajax調用返回的值來填充它。 這是json格式。
#inst_name是輸入[type = text],其中有2件事。
HTML:
<input type="text" name="inst_name" id="inst_name" />
<form method="post" action="">
<textarea name="inst_addr" id="inst_addr"></textarea>
<select name="inst_prov" id="inst_prov">
<option value="1">Bangkok</option>
<option value="2">Chiang Mai</option>
<option value="3">Samui</option>
<option value="4">Phuket</option>
</select>
<input type="text" name="inst_tel" id="inst_tel" />
<input type="text" name="inst_fax" id="inst_fax" />
<label><input type="radio" name="inst_dep" id="inst_dep1" value="1" />Dep 1</label>
<label><input type="radio" name="inst_dep" id="inst_dep2" value="2" />Dep 2</label>
<label><input type="radio" name="inst_dep" id="inst_dep3" value="3" />Dep 3</label>
</form>
jQuery的:
$('#inst_name').keyDown(function(){
$.ajax({
url: 'inc/form_institute.json.php',
dataType:'json',
data: {name:$('#inst_name').val()},
success: function(data){
$('#inst_addr').html(data.addr);
$('#inst_prov').val(data.prov);
$('#inst_zip').val(data.zip);
$('#inst_tel').val(data.tel);
$('#inst_fax').val(data.fax);
$('#inst_dep').val(data.dep);
}
});
});
JSON:
{
"addr":"123/4 Kitty Ave.",
"prov":"80",
"zip":"12345",
"tel":"0753245675",
"fax":"075123456",
"dep":"2"
}
嘗試使用:
$(document).on("keyup", "#inst_name", function(){
//you're ajax here
}
這樣,您輸入的內容越多,響應將越具體。
祝好運 :)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.