您的位置:首页 > 其它

mvc4强类型绑定提交form不想刷新页面的处理

2013-11-18 13:40 267 查看
自己日前做网站时遇到的问题,一个非常复杂的模型,点击提交按钮时不能提交而需要弹出一个确认的详细信息的对话框。因为该网页结构定义复杂,

若button类型不为submit就需要自己一个个获取对应的值,实在太麻烦;若为submit就需要将整个form提交,这样就要刷新页面,怎么都没法处理。

在网上也是自己查了很长时间,只因当时未保留有效的网址,不能给大家提供出处了,非常抱歉。现将做法告知其他有需要的朋友们。

1. VIEW和Model是强类型绑定,model又非常复杂,不想刷新页面

2.  html中描述input类型为button,并定义click函数 Form id 为testform

 <input type="button" id="testBtn" class="btn" value="test" onclick="doclick()"/>

3. js中处理

function doclick() {

    var dataVo = $("#testform").serializeArray();       //转化为json对象

    var dataJson = convertToJson(dataVo);              //将表单转化成的json对象进行重新组织

    dataVo = JSON.stringify(dataJson);                    //将json对象转化为序列化为json字符串

    $.post("/test/test", dataVo,

    function (result) {

               alert("success");

        }

    });

}

/**

* 将表单对象转为json对象

* @param formValues

* @returns

*/

function convertToJson(formValues) {

    var result = {};

    for (var formValue, j = 0; j < formValues.length; j++) {

        formValue = formValues[j];

        var name = formValue.name;

        var value = formValue.value;

        if (name.indexOf('.') < 0) {

            result[name] = value;

            continue;

        } else {

            var simpleNames = name.split('.');

            // 构建命名空间

            var obj = result;

            for (var i = 0; i < simpleNames.length - 1; i++) {

                var simpleName = simpleNames[i];

                if (simpleName.indexOf('[') < 0) {

                    if (obj[simpleName] == null) {

                        obj[simpleName] = {};

                    }

                    obj = obj[simpleName];

                } else { // 数组

                    // 分隔

                    var arrNames = simpleName.split('[');

                    var arrName = arrNames[0];

                    var arrIndex = parseInt(arrNames[1]);

                    if (obj[arrName] == null) {

                        obj[arrName] = []; // new Array();

                    }

                    obj = obj[arrName];

                    multiChooseArray = result[arrName];

                    if (obj[arrIndex] == null) {

                        obj[arrIndex] = {}; // new Object();

                    }

                    obj = obj[arrIndex];

                }

            }

            if (obj[simpleNames[simpleNames.length - 1]]) {

                var temp = obj[simpleNames[simpleNames.length - 1]];

                obj[simpleNames[simpleNames.length - 1]] = temp;

            } else {

                obj[simpleNames[simpleNames.length - 1]] = value;

            }

        }

    }

    return result;

}

4. controller中需要先将json字符串返序列化为对应的model

   
using System.Web.Script.Serialization;

         [HttpPost]

        public ActionResult test( )

        {

                var inputstream = HttpContext.Request.InputStream;

                string json = new StreamReader(inputstream).ReadToEnd();

                try

                {

                    JavaScriptSerializer js = new JavaScriptSerializer();

                    TestModel model = js.Deserialize<TestModel>(json);

                }

                catch (Exception e)

                {

                    System.Diagnostics.Debug.WriteLine(e.Message);

                }

    }
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  mvc4 表单 不提交