Jquery Ajax方法传值到action的方法


Posted in Javascript onMay 11, 2014

假设cshtml文件中是这样的:

<script type="text/javascript">
        $(document).ready(function(){
            $("#btn").click(function(){
             $.ajax({
                type: 'POST',
                url: "/Home/MyAjax",
                data: {
                    val1: $("#txt1").val(),
                    val2: $("#txt2").val(),
                    val3: $("#txt3").val(),
                    val4: $("#txt4").val(),
                },
                dataType: "json"
            });
            });
        });  
</script>
<input id="btn" type="button" value="click" />
<input id="txt1" type="text" value="" />
<input id="txt2" type="text" value="" />
<input id="txt3" type="text" value="" />
<input id="txt4" type="text" value="" />

data是json数据。传递到的Action是/Home/MyAjax。那么在Action方法处接收的方式如下:

public ActionResult MyAjax(string val1)        {
            string val2 = Request["val2"].ToString();
            string val3 = Request.Form["val3"].ToString();
            string val4 = Request.Params["val4"].ToString();
            return Content("ViewUserControl1");
        }

 或者接收参数为FormCollection,也有同样的效果。

 public ActionResult MyAjax(FormCollection f)        {
            string val2 = f["val2"].ToString();
            string val3 = f["val3"].ToString();
            string val4 = f["val4"].ToString();
            return Content("ViewUserControl1");
        }

 MVC3的强悍之处,是它是基于变量参数命名匹配的机制,就是说它尽可能的查找能够有相同变量名字的值。对于上面的例子,我们甚至可以构造出一个class,如下:public class aclass {

    public string val1 { set; get; }
    public string val2 { set; get; }
    public string val3 { set; get; }
    public string val4 { set; get; }
}

那么就可以设置参数类型为aclass

    public ActionResult MyAjax(aclass f)        {
          return Content(f.val1+f.val2+f.val3+f.val4);
        }

注意,aclass类的属性名就是json的key的名字,只要符合一致,它就能匹配,不得不说强悍。

Javascript 相关文章推荐
JQuery 文本框回车跳到下一个文本框示例代码
Aug 30 Javascript
ie8模式下click无反应点击option无反应的解决方法
Oct 11 Javascript
基于jquery固定于顶部的导航响应浏览器滚动条事件
Nov 02 Javascript
javascript中hasOwnProperty() 方法使用指南
Mar 09 Javascript
jQuery中text() val()和html()的区别实例详解
Jun 28 Javascript
javascript 数组的正态分布排序的问题
Jul 31 Javascript
Javascript中document.referrer隐藏来源的方法
Jan 16 Javascript
Vue.js实现输入框绑定的实例代码
Aug 24 Javascript
p5.js入门教程之键盘交互
Mar 19 Javascript
layui form表单提交之后重新加载数据表格的方法
Sep 11 Javascript
vue中移动端调取本地的复制的文本方式
Jul 18 Javascript
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
Jan 29 jQuery
json的定义、标准格式及json字符串检验
May 11 #Javascript
Jquery操作js数组及对象示例代码
May 11 #Javascript
Jquery+asp.net后台数据传到前台js进行解析的方法
May 11 #Javascript
如何防止回车(enter)键提交表单
May 11 #Javascript
js取整数、取余数的方法
May 11 #Javascript
浏览器窗口大小变化时使用resize事件对框架不起作用的解决方法
May 11 #Javascript
基于jquery实现的图片在各种分辨率下未知的容器内上下左右居中
May 11 #Javascript
You might like
laravel-admin 中列表筛选方法
2019/10/03 PHP
深入解析PHP底层机制及相关原理
2020/12/11 PHP
关于 byval 与 byref 的区别分析总结
2007/10/08 Javascript
用nodejs写的一个简单项目打包工具
2013/05/11 NodeJs
js阻止冒泡及jquery阻止事件冒泡示例介绍
2013/11/19 Javascript
js点击button按钮跳转到另一个新页面
2014/10/10 Javascript
JavaScript简单判断复选框是否选中及取出值的方法
2015/08/13 Javascript
Javascript中replace()小结
2015/09/30 Javascript
深入解析JavaScript编程中的this关键字使用
2015/11/09 Javascript
jquery+json实现数据二级联动的方法
2015/11/28 Javascript
JS简单实现String转Date的方法
2016/03/02 Javascript
JS实现回到页面顶部动画效果的简单实例
2016/05/24 Javascript
jquery 动态增加,减少input表单的简单方法(必看)
2016/10/12 Javascript
AngularJS压缩JS技巧分析
2016/11/08 Javascript
简单了解微信小程序 e.target与e.currentTarget的不同
2019/09/27 Javascript
基于element-ui封装可搜索的懒加载tree组件的实现
2020/05/22 Javascript
Python科学计算环境推荐——Anaconda
2014/06/30 Python
Anaconda多环境多版本python配置操作方法
2017/09/12 Python
Python 使用Numpy对矩阵进行转置的方法
2019/01/28 Python
Python中使用pypdf2合并、分割、加密pdf文件的代码详解
2019/05/21 Python
Python 格式化输出_String Formatting_控制小数点位数的实例详解
2020/02/04 Python
python简单实现最大似然估计&amp;scipy库的使用详解
2020/04/15 Python
python定时截屏实现
2020/11/02 Python
实例讲解使用CSS实现多边框和透明边框的方法
2015/09/08 HTML / CSS
ONLY瑞典官网:世界知名服装品牌
2018/06/19 全球购物
Bugatchi官方网站:男士服装在线
2019/04/10 全球购物
Kickers鞋英国官网:男士、女士和儿童鞋
2021/03/08 全球购物
Java的for语句中break, continue和return的区别
2013/12/19 面试题
主要的Ajax框架都有什么
2013/11/14 面试题
大学军训感言800字
2014/02/27 职场文书
网络编辑职责
2014/03/01 职场文书
经营理念标语
2014/06/21 职场文书
护士工作失误检讨书
2014/09/14 职场文书
开展党的群众路线教育实践活动情况汇报
2014/11/05 职场文书
龙猫观后感
2015/06/09 职场文书
php 原生分页
2021/04/01 PHP