在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 });
        }

VIEW层AJAX提交表单到Controller的实体的更多相关文章

  1. MVC中ajax提交表单示例

    页面中: @using (Ajax.BeginForm("Login", "User", new AjaxOptions() { HttpMethod = &q ...

  2. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  3. Validator验证Ajax提交表单的方法

    Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...

  4. lavarel框架中如何使用ajax提交表单

    开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加 在网上看了很多的解决方式,我是用下面这种方法解决的: ...

  5. Jquery ajax提交表单几种方法详解

    [导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...

  6. ajax提交表单序列化(serialize())数据

    知识点: $("#form").serialize();将表单数据序列化为标准URL编码文本字符串(key1=value1&key2=value2…). 以下用一个例子来演 ...

  7. jquery实现ajax提交表单

    一般情况下,我们提交form表单采用的是submit的方法,典型的场景如下. <form id="thisForm" method="post" acti ...

  8. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

  9. Ajax提交表单初接触

    <!doctype html> <html class="no-js"> <head> <meta charset="utf-8 ...

随机推荐

  1. ArcGIS for Android示例解析之空间查询-----QueryTask

    转自:http://blog.csdn.net/wozaifeiyang0/article/details/7331450 QueryTask 查询功能在GIS中是一个不可或缺的重要功能,示例中提供了 ...

  2. JDK1.5新特性(四)……Autoboxing/Unboxing

    援引 Autoboxing/Unboxing - This facility eliminates the drudgery of manual conversion between primitiv ...

  3. Ubuntu13.04配置完全指南(转)

    Ubuntu13.04配置完全指南(一)软件源 教育网推荐使用USTC软件源. 首先备份现有软件源: $ sudo cp /etc/apt/sources.list /etc/apt/sources. ...

  4. HW2.21

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  5. PHP中Get()和Post()用法详解

    作为一个计算机系统,输入输出设备作为非核心设备却是不可或缺的,硬件如此,软件亦是如此.试想一台功能强劲的计算机,如果没有输入输出设备,它与一块只能耗电并且发出嗡嗡噪音的废铁有何不同.应用程序的道理也是 ...

  6. A Tour of Go Type conversions

    The expression T(v) converts the value v to the type T. Some numeric conversions: var i int = 42 var ...

  7. hdoj 1898 Sempr == The Best Problem Solver?

    Sempr == The Best Problem Solver? Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65535/3276 ...

  8. java中服务器启动时,执行定时任务

    package com.ripsoft.util; import java.util.Calendar; import java.util.Timer; import javax.servlet.Se ...

  9. java request判断微信客户端访问

    微信客户端访问时候user-agent信息如下: Mozilla/5.0 (Linux; Android 5.0.1; M040 Build/LRX22C) AppleWebKit/537.36 (K ...

  10. IOS7 自定义UIBarButtonItem 的一些问题

    ios 下自定义导航栏的BarButtonItem 会产生一些偏移问题, 解决方案: 通过新建一个系统的带固定距离的Item来调节你的Item #define   IOS7_NAVI_SPACE   ...