您的位置:首页 > 其它

关于异步提交form表单

2012-08-17 17:40 501 查看
1.异步提交form 表单 方法一:

采用隐藏iframe来提交表单,

代码:<div id="upload_file" title="<%=Res.CulInfo.Attachment %>"

style="width: 400px; height: 120px; margin: 5px auto;
display: none">
<div id="outputdiv" style="color:Red; font-size:18px; text-align:center ;"></div>
<form id="filePost" name="filePost" action="upload.ashx"

method="post" enctype="multipart/form-data" target="uploadframe">
<table class="TabSpan">
<tr>
<td colspan="2"> <input type="hidden" id="upload_id" name="upload_id" />
 <input id="file_id" name="file" type="file" style="width: 300px" /></td>
</tr>
<tr>

<td><input type="checkbox" id="chkPoc" name="chkPoc" value="Y"/>是否房产证</td>

<td> <input type="submit" value="<%=Res.CulInfo.UpLoad %>" ></td>

</tr>
</table>
</form>
</div>

<iframe id="uploadframe" name="uploadframe" style="visibility:hidden;"></iframe>

2.利用jqueyr .form 来提交表单

/********************************************************
******功能描述:form input and file ajax submit (需要jquery.js ,jquery.form.js 顺序不能调整)
******作者:lin.su
******参数描述:targetDiv(成功或者错误显示的div的Id 这个必须在调用的页面存在)
******参数描述:authenMethod(提交form 之前调用的验证(这个需要开发者实现需要验证字段) )
******参数描述:successMothod(提交form 之后需要刷新数据方法 )
******参数描述:urlForm(提交form 的url (action 提交目标) )
******参数描述:formControlId(提交form 的id 这个必须 )
******时间:2012年7月30日
******示例:submitajax_jquery_from("outdiv",VaildMothod,successMothod,"/Home/Upload","MyForm")
********************************************************/
function submitajax_jquery_from(targetDiv, authenMethod, successMothod,urlForm, formControlId) {
var options = {
target: "#" + targetDiv,
beforeSubmit: authenMethod,
success: successMothod,
url: urlForm,
type: 'post',
clearForm: true,
resetForm: true,

forceSync: true,
error: function (responseText, statusText) { alert('status: ' + statusText + '\n\nresponseText: \n' + responseText ); },
timeout: 300000
};
$('#' + formControlId).ajaxForm(options);
}

清空上传文件框数据: document.getElementById("file_id").outerHTML = document.getElementById("file_id").outerHTML;

jquery.form.js APIhttp://www.malsup.com/jquery/form/#api
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: