VIEW层AJAX提交表单到Controller的实体(AJAX传递序列化的输入元素)

本文介绍如何在MVC环境中使用AJAX方式提交表单数据至控制器的特定Action,包括前端HTML和JavaScript代码实现,以及后端控制器接收和处理数据的方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在MVC环境中,AJAX方式添加一个对象,这个对象在Models中是一个视图模型,在前台显示时是这样的代码:

  <%using (Html.BeginForm())
      { %>
    姓名:<%=Html.TextBoxFor(model=>model.UserName) %>
    Email:<%=Html.TextBoxFor(model=>model.Email) %>
    年龄:<%=Html.TextBoxFor(model=>model.Age) %>
    <input type="button" id="btn" value="提 交" />
    <%} %>

当单击提交按钮时,使表单中的数据提交到controller中指定的action中,代码如下:

   <script type="text/javascript">
        $(function () {
            $("#btn").click(function () {
                $.ajax({
                    type: "POST",
                    url: "/Home/Create",
                    data: $("form").serialize(),
                    success: function (data) {
                        if (data.success == true)
                            alert("成功,用户为("+data.name+")");
                        else
                            alert("失败");
                    }
                });
            });
        });
    </script>

在上面代码中,使用了JS的序列化serialize(),它把一组输入元素序列化为数据字符串,它们与实体名一一对应

在controller中,会通过一个实体参数接收这个序列化的字符串

        [HttpPost]
        public ActionResult Create(CreateUserModels entity)
        {

            return Json(new { success = true,name=entity.UserName });
        }

OK,不敢相信吧,它居然是可以得到我们前台传过来的数据的,呵呵.

 

转载于:https://www.cnblogs.com/lori/archive/2011/10/10/2206626.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值