ASP.NET MVC 模式下使用easyUI的Form表单提交填坑

用easyUI框架做form表单的提交,提交后发现后台老是报错,要么是提示路径不对,要么是提示没有表单验证字段。

几经检查发现,原来我后台按照常规的MVC模式,在方法前面加了限制为POST请求, 并且强制要求验证表单。所以easyUI自带的form表单提交方法无法提交。

后台代码如下:

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult SubmitForm(RdProjectTaskEntity mEntity, string keyValue)
{
   app.SubmitForm(mEntity, keyValue);
   return Success("操作成功。");
}

 

解决的方法有两个:

第一个是将后台方法的[HttpPost]  和 [ValidateAntiForgeryToken] 验证取消;

第二个是在前端form 中加入method="post" 属性,这样提交的时候就能以POST方式提交。关于防伪字段验证,可以再在form的onSubmit方法中加入一段代码

if ($('[name=__RequestVerificationToken]').length > 0) {
                param.__RequestVerificationToken = $('[name=__RequestVerificationToken]').val();
            }

手动将页面中的__RequestVerificationToken 加入到form的表单参数中提交给后台。这样既可以保证使用POST提交,又能够进行表单防伪验证。

第二种方法的前端完整代码:

<script>
    $("#form1").form({
        url: "/ServiceManage/SubmitForm?keyValue=" + keyValue,
        ajax: true,
        onSubmit: function (param) {
            if ($('[name=__RequestVerificationToken]').length > 0) {
                param.__RequestVerificationToken = $('[name=__RequestVerificationToken]').val();
            }
            var isValid = $(this).form('enableValidation').form('validate');
            if (!isValid) {
                $.loading(false);
            }
            return isValid;
        },
        success: function (data) {
            var data = eval('(' + data + ')');
            if (data.state == "success") {
               
            } 
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
           
        }
    });
    $(form).submit();
</script>
<body>
<form id="form1" method="post">
 <input id="T_Title" name="T_Title" type="text" class="easyui-textbox" style="width:100%" data-options="required:true">
</form>
</body>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章