ASP.NET MVC中从前台页面视图（View）传递数据到后台控制器（Controller）方式

来源：互联网发布：淘宝货源客户达编辑：程序博客网时间：2024/04/29 16:42

方式一：

数据存储模型Model：此方式未用到数据存储模型Model，仅简单的字符串string型数据传递

前台接收显示数据视图View：

<div style="height:300px; width:100%">        <div style="margin-left:100px;margin-top:50px;">            <input id="testData" type="text" style="width:200px;" /><br />            <input id="submitButton" type="button" style="height: 25px; width: 75px;margin-top:35px;" value="submit">        </div></div>

View Code

<script type="text/javascript">        $(function () {            $("#submitButton").click(function () {                var data = $('#testData').val();                $.post("/TransportData/GetFrontViewData", { frontViewData: data }, function () {                    alert("submit data is OK!");                });            });        })       </script>

View Code

后台处理数据控制器Controller：

public class TransportDataController : Controller    {        //        // GET: /TransportData/        public ActionResult Index()        {            return View();        }        public string GetFrontViewData(string frontViewData)        {            //handle frontViewData code            return frontViewData;        }    }

View Code

传输中数据样式截图：

　　前台视图View输入测试值：

　　后台控制器Controller获得此值：

方式二：

（借鉴：刘哇勇的部落格）

数据存储模型Model：

public class Model    {        public string rtoNumber { set; get; }        public string approver { set; get; }        public string modifier { set; get; }        public string comment { set; get; }    }

View Code

前台接收显示数据视图View：

<div id="container">        <table id="table">            <tr>                <td><label>RTONumber</label><input name="rtoNumber" /></td>                <td><label>Approver</label><input name="approver" /></td>                <td><label>Modifier</label><input name="modifier" /></td>                <td><label>Comment</label><textarea name="comment" cols="30" rows="4"></textarea></td>            </tr>        </table>        <input id="submit" type="button" value="submit"/></div>

View Code

<script type="text/javascript">        $(function () {            $('#submit').click(function () {                var model = [];                var subModel = [];                $.each($("table tr"), function (i, item) {                    var RTONumber = $(item).find("[name=rtoNumber]").val();                    var Approver = $(item).find("[name=approver]").val();                    var Modifier = $(item).find("[name=modifier]").val();                    var Comment = $(item).find("[name=comment]").val();                    model.push({ rtoNumber: RTONumber, approver: Approver, modifier: Modifier, comment: Comment, checkBoxValue: subModel });                });                $.ajax({                    url: '/TransportModelData/getModelInfo',                    data: JSON.stringify(model),                    type: 'POST',                    contentType: 'application/json;charset=utf-8',                    async: false,                    success: function (data) {                        //window.location.href = "/RequestStatus/RequestDetail?requestID=" + data.RequestID;                        alert("Postting data is over!");                    }                });            });        });</script>

View Code

后台处理数据控制器Controller：

public class TransportModelDataController : Controller    {        //        // GET: /TransportModelData/        public ActionResult Index()        {            return View();        }        public ActionResult getModelInfo(List<Model> model)        {            string rtoNumber = model[0].rtoNumber;            string modifier = model[0].modifier;            string comment = model[0].comment;            string approver = model[0].approver;            return Content("");        }    }

View Code

传输中数据样式截图：

　　前台视图View输入测试值：

　　后台控制器Controller获得此值：

本人用到及此，下次遇到再续写，谢谢！（有错有缺陷请指导）

0 0