Asp.net mvc json前后台传输

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xunbaogang/article/details/82893432

一、JSON到后台

首先是数据从前台传递数据到后台controller 操作,使用方式还是通过ajax 来提交数据

json 数据如下:

 //获取提交的json数据
    function GetSubmitData() {

        var jsondata = '{'

        + '"TaskID":' + '"asdfasdfa2323",'
        + '"TaskName":' + '"asdfasdfa",'
        + '"TaskNum":' + '"JBRSP",'
        + '"TaskUserType":' + '"1",'
        + '"TaskUser":' + '"1212212",'
        + '"TaskOrder":' + '"1",'
        + '"RejectType":' + '"1",'
        + '"RejectStepTaskID":' + '"",'
        + '"LimitConditionStep":[{'
        + '"ALCField":' + '"asdfasd",'
        + '"ALCContrast":' + '">",'
        + '"ALCValue":' + '"200",'
        + '"NextTaskID":' + '"322323",'
        + '}]}'

        return JSON.parse(jsondata)
    }

提交的ajax 操作如下:

//提交数据
    function SubmitInfo()
    {
        var jsonObj = GetSubmitData();

        $.ajax({
            url: '@Url.Action("CreateTask", "WFTask")',
            data: jsonObj,
            type: 'POST',
            contentType: 'application/x-www-form-urlencoded',
            sucess: function (result) {
                alert(result);
            }
        });
    }

后台获取数据的时候是通过request.Form 来获取的,但这里有个问题request.From 对复杂数据内容是通过索引的方式来获取的代码如下:

/// <summary>
        /// 把 Request.From 中的数据转化为WFTaskView对象
        /// </summary>
        /// <param name="request"></param>
        /// <returns></returns>
        private WF_TaskView ConvertTaskView(HttpRequestBase request)
        {
            WF_TaskView obj = new WF_TaskView();

            int requestCount = request.Form.Count;

            obj.TaskID = request.Form["TaskID"].ToString();
            obj.TaskNum = request.Form["TaskNum"].ToString();
            obj.TaskName = request.Form["TaskName"].ToString();
            obj.TaskUserType = request.Form["TaskUserType"].ToString();
            obj.TaskUser = request.Form["TaskUser"].ToString();
            obj.TaskOrder = request.Form["TaskOrder"].ToString();
            obj.RejectType = request.Form["RejectType"].ToString();
            obj.RejectStepTaskID = request.Form["RejectStepTaskID"].ToString();

            List<LimitConditionStep> limitList = new List<LimitConditionStep>();

            if (requestCount == 8) //提交的内容没有跳转点
            {
                return obj;  
            }
            else //多个跳转点
            {
                //循环次数
                int rcount = (requestCount - 8) / 4;

                for (int i = 0; i < rcount; i++)
                {
                    LimitConditionStep limitobj = new LimitConditionStep();

                    limitobj.ALCField = request.Form["LimitConditionStep[" + i + "][ALCField]"].ToString();
                    limitobj.ALCContrast = request.Form["LimitConditionStep[" + i + "][ALCContrast]"].ToString();
                    limitobj.ALCValue = request.Form["LimitConditionStep[" + i + "][ALCValue]"].ToString();
                    limitobj.NextTaskID = request.Form["LimitConditionStep[" + i + "][NextTaskID]"].ToString();                    

                    limitList.Add(limitobj);
                }

                obj.LimitConditionStep = limitList;
            }

            return obj;
        }        

我的json 中的内部子元素是LimitConditionStep,然后是索引,后面是字段名称,就可以获取到对应的数据

二、后台JSON传递到前台

后台通过方法内json转换就能把前端获取的数据返回出来,代码如下

  /// <summary>
        /// 获取当前流程已存在的节点
        /// </summary>
        /// <returns></returns>
        public JsonResult GetWFTask()
        {
            List<WF_Task> rtasklist = dal.GetWFTask(processId);

            return Json(rtasklist);
        }

前端数据请求,需要把获取到的数据放到数组中,代码如下:

 //当前结点
    function GetCurrentTask()
    {
        //当前结点
        var taskArray = new Array();

        //驳回节点
        $.ajax({
            type: 'POST',
            url: '../WFTask/GetWFTask',
            async: false,
            dataType: 'json',
            success: function (response) {
                for (var i = 0; i < response.length; i++) {
                    var option = {};
                    option.id = response[i]["TaskID"];
                    option.text = response[i]["TaskName"];

                    taskArray.push(option);
                }
            }
        });

        return taskArray;
    }

在使用ligerUI中的cobox 数据绑定的时候需要在html中添加上:

       <input type="text" id="sel_AuditUser" />
                <input type="hidden" id="sel_AuditUserValue" />

下拉框控件赋值如下:

        //绑定数据到驳回cobox
        $("#sel_RejectStepTaskID").ligerComboBox({
            data: taskArray,
            valueFieldID: 'sel_RejectTypeValue'
        });
        

三,效果图

猜你喜欢

转载自blog.csdn.net/xunbaogang/article/details/82893432