MVC使用jQuery从视图向控制器传递Model的2种方法

时间:2022-08-30 15:23:17

http://blog.csdn.net/make1828/article/details/29846003

MVC使用jQuery从视图向控制器传递Model的2种方法
using System.ComponentModel.DataAnnotations;

namespace MvcApplication1.Models
{
public class Movie
{
public int Id { get; set; }
[Required(ErrorMessage = "必填")]
public string Title { get; set; }
}
}
MVC使用jQuery从视图向控制器传递Model的2种方法

HomeController中,一个Action用来显示强类型视图,一个用来接收从视图传递过来的Model。

MVC使用jQuery从视图向控制器传递Model的2种方法
using System.Web.Mvc;
using MvcApplication1.Models; namespace MvcApplication1.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View(new Movie());
} public ActionResult AddMovie(Movie movie)
{
return Json(new {msg = "ok"});
} }
}
MVC使用jQuery从视图向控制器传递Model的2种方法

方法一:通过jQuery的serialize()方法

MVC使用jQuery从视图向控制器传递Model的2种方法
@model MvcApplication1.Models.Movie

@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
} <h2>Index</h2> @using (Html.BeginForm("AddMovie", "Home", FormMethod.Post, new {id = "addForm"}))
{
@Html.EditorFor(m => m.Title)
@Html.ValidationMessageFor(m => m.Title)
<br/>
<input type="button" id="addMovie" value="提交"/>
} @section scripts
{
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script type="text/javascript">
$(function() {
$('#addMovie').click(function(e) {
e.preventDefault();
if ($('#addForm').valid()) {
$.ajax({
url: $('#addForm').attr('action'),
type: $('#addForm').attr('method'),
data: $('#addForm').serialize(),
success: function(data) {
if (data.msg == 'ok') {
alert('提交成功');
}
}
});
}
});
});
</script> }
MVC使用jQuery从视图向控制器传递Model的2种方法

方法二:通过jQuery的 JSON.stringify()方法把匿名对象转换成json

MVC使用jQuery从视图向控制器传递Model的2种方法
$(function() {
$('#addMovie').click(function(e) {
e.preventDefault();
if ($('#addForm').valid()) {
addMovie();
}
});
}); function addMovie() {
var movie = {
"Title" : $('#Title').val()
}; $.ajax({
url: '@Url.Action("AddMovie","Home")',
data: JSON.stringify(movie),
type: 'POST',
contentType: 'application/json;charset=utf-8',
success: function(data) {
if (data.msg == 'ok') {
alert('提交成功');
}
}
});
}
MVC使用jQuery从视图向控制器传递Model的2种方法

MVC使用jQuery从视图向控制器传递Model的2种方法的更多相关文章

  1. MVC使用jQuery从视图向控制器传递Model&comma;数据验证&comma;MVC HTML辅助方法小结

    //MVC HTML辅助类常用方法记录 (1)@Html.DisplayNameFor(model => model.Title)是显示列名, (2)@Html.DisplayFor(model ...

  2. 译:什么是ViewData的, ViewBag和TempData? - MVC为当前和后续请求之间传递数据的三种方法

    译文出处:http://www.codeproject.com/Articles/476967/WhatplusisplusViewData-cplusViewBagplusandplusTem AS ...

  3. SpringMVC 学习 十一 springMVC控制器向jsp或者别的控制器传递参数的四种方法

    以后的开发,大部分是发送ajax,因此这四种传递参数的方法,并不太常用.作为了解吧 第一种:使用原生 Servlet 在控制器的响应的方法中添加Servlet中的一些作用域:HttpRequestSe ...

  4. 【ASP&period;NET MVC系列】浅谈ASP&period;NET MVC 视图与控制器传递数据

    ASP.NET MVC系列文章 [01]浅谈Google Chrome浏览器(理论篇) [02]浅谈Google Chrome浏览器(操作篇)(上) [03]浅谈Google Chrome浏览器(操作 ...

  5. ASP&period;NET MVC 数据传递 视图向控制器传递

    视图向控制器传递 MVC 视图向控制器传递,就是获取用户输入的数据,在去进行操作 好了,我们不多说直接进行我们的案例. 在HomeController类中添加下来方法 [HttpPost] publi ...

  6. 5&period;MVC框架开发(强类型开发,控制器向界面传递数据的几种方法)

    界面表单中的表单元素名字和数据库表的字段名相一一映射(需要哪个表的数据就是那个表的模型(Model)) 在View页面中可以指定页面从属于哪个模型 注:以上的关系可以通过MVC的强类型视图开发来解决我 ...

  7. &lbrack;&period;net 面向对象程序设计深入&rsqb;(6)&period;NET MVC 6 —— 模型、视图、控制器、路由等的基本操作

    [.net 面向对象程序设计深入](6).NET MVC 6 —— 模型.视图.控制器.路由等的基本操作 1. 使用Visual Studio 2015创建Web App (1)文件>新建&gt ...

  8. 如何使用T-SQL备份还原数据库及c&num;如何调用执行? C&num;中索引器的作用和实现。 jquery控制元素的隐藏和显示的几种方法。 localStorage、sessionStorage用法总结 在AspNetCore中扩展Log系列 - 介绍开源类库的使用(一) span&lt&semi;T&gt&semi;之高性能字符串操作实测

    如何使用T-SQL备份还原数据库及c#如何调用执行? 准备材料:Microsoft SQL Server一部.需要还原的bak文件一只 一.备份 数据库备份语句:user master backup ...

  9. Angular 向组件传递模板的几种方法

    最近在写一个日期选择器组件,为了满足将来可能出现的各种需求,所以需要能够高度的自定义组件的样式.为了达到这个目的,需要能够在日期选择器组件外控制每个日期格子内要显示的内容,比如,标上节假日之类的.这时 ...

随机推荐

  1. lintcode bugfree and good codestyle note

    2016.12.4, 366 http://www.lintcode.com/en/problem/fibonacci/ 一刷使用递归算法,超时.二刷使用九章算术的算法,就是滚动指针的思路,以前写py ...

  2. Flex数据交互之Remoting

    一 前言 Flex数据交互常用的有三种方式:WebService.HttpService以及Remoting. WebService方式已在这篇文章中给出,这篇文章主要讲解以Remoting方式进行数 ...

  3. 《30天自制操作系统》17&lowbar;day&lowbar;学习笔记

    harib14a: 接着上一天的内容,我们来思考一个问题:当所有的LEVEL中都没有任务的时候怎么办?采用前面定时器链表中加入“哨兵”的思路,我们加入一个idle任务,去执行HLT.接下来我们只需要将 ...

  4. 【第〇课】用更好的IDE开发

    推荐的IDE IntelliJ IDEA JetBrains是一家捷克的软件开发公司,这家公司做出了很多的优秀的IDE,有写python的.php的.web前端的……IDEA就是其中一款非常优秀的ja ...

  5. VS2013无法启动 IIS Express Web解决办法

    不要勾选[覆盖应用程序根URL(U)],或让[覆盖应用程序根URL(U)]下面的输入框和上面的输入框的地址一样! 使用VS2013有一段时间了,因前期都是编写C/S程序,没有使用到B/S调试器.前几日 ...

  6. JAVA 获取jdbc&period;properties配置信息

    Properties myProperty = new Properties();String jdbcPath = PathKit.getWebRootPath()+File.separator+& ...

  7. java post 请求

    新公司的分词为post调用方式,以前还没用过post,这次上网查了下,比较简单,但还是写篇博客记录下,代码为网上找的,非原创. package com.chuntent.tool; import ja ...

  8. Python-Day15 JavaScript&sol;DOM

    JavaScript JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处理. ...

  9. Hibernate命名空间怎样实现?

    什么是命名查询?  Hibernate同意在映射文件里定义字符串形式的查询语句.这样的查询方式成为命名查询  使用命名查询有什么优点?  因为使用Hibernate的HQL经常须要在Java代码中写字 ...

  10. JDK 和JRE的区别

    JRE:Java Runtime Environment/Java运行时环境目标用户:只需要运行Java程序的用户JRE包含了:Deployment,User Interface Toolkits,I ...