[英]Jquery Ajax pass data between two forms
I have a page with an ajax filled autocomplete field, if an extra addition to the autocomplete is needed, based upon the user selctind add new on the ('mainForm') I am popping up a modal form ('subForm') in which to enter the new data, process on the server using classic asp via an ajax post I would then like to pass the resulting data (two fields returned after a database insert, locId and locName) back to orginal form. 我有一个带有ajax填充自动完成字段的页面,如果需要额外添加自动完成,基于用户selctind在('mainForm')上添加new我会弹出一个模态形式('subForm'),其中输入新数据,使用经典asp通过ajax文件在服务器上进行处理,然后我想将结果数据(数据库插入后返回的两个字段,locId和locName)传递回原始形式。
Original form 原始形式
<form method="post" action="default.asp" name="mainForm" id="mainForm">
.... rest of form ....
<label for="locName">Location (autocomplete): </label>
<input type="text" name="locName" id="locName" value="locName"/>
<label for="locId">Location Id: </label>
<input type="text" name="locId" id="locId" value="locId"/>
<input type="submit" name="sub" id="sub" value="sub"/>
</form>
Modal Form 模态表格
<form name="subForm" id="subForm" action="default.asp">
<label for="nme">Name</label><input type="text" name="nme" id="nme" />
<label for="pcd">Postcode</label><input type="text" name="pcd" id="pcd" />
<input type="submit" name="sub2" id="sub2" value="sub2"/>
</form>
The modal form is then processed on the server after an ajax submit. 然后在ajax提交后在服务器上处理模态表单。 The form is submitted to a database and creates two values (id,name) - I'd like to to pass these values back to the original form into 表单被提交到数据库并创建两个值(id,name) - 我想将这些值传递回原始表单
Jquery so far Jquery到目前为止
$(document).ready(function() {
var $form = $('#subForm');
$form.submit( function() {
$.ajax({
beforeSend:function(response){$("#locName").val("loading...");},
cache:false,
data: $(this).serialize(),
type: $(this).attr('method'),
url: $(this).attr('action'),
// this is the bit I need help with
success:function(response){
$("#locName").val(response); // populate original form
$("#locId").val(response); // populate original form
},
// ---------------------------------------------
error:function(){alert("error")},
complete:function(){alert("done");}
});
return false;
});
});
Thanks in advance 提前致谢
Steve 史蒂夫
Assuming that 'response' is a JSON formatted string returned by your server (eg "{locName:'Groenland', locId:'212'}"
): 假设'response'是服务器返回的JSON格式字符串(例如"{locName:'Groenland', locId:'212'}"
):
success:function(response){
//You need to first parse JSON data:
var data = jQuery.parseJSON(response);
//Then fill the original form
$("#locName").val(data.locName); // populate original form
$("#locId").val(data.locId); // populate original form
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.