C#_ajax_demo
使用asp.net mvc 调用Action方法很简单。
一、无参数方法。
1、首先，引入jquery-1.5.1.min.js 脚本，根据版本不同大家自行选择。
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
2、在Controllers中书写前台Ajax需要调用的Action，比如：
public ActionResult test1()
{
return Content("返回一个字符串");
}
这个Action返回了一个字符串。注意这里的返回，不是return View();
3、我们回到前台，假设我的功能是当页面中1个按钮单击时调用后台的Action并返回1个字符串。
<input type="text" id="txt1" name="txt1" />
<input type="button" id="btnSub" name="btnSub" value="调用Action" />
如上，我的界面里放了1个文本框和1个按钮。那下面我们来实现当按钮单击时候调用后台方法返回字符并赋值给文本框的。
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$("#btnSub").click(function () {
$.ajax({
type: "POST",
url: "/Home/test1",
data: "",
success: function (sesponseTest) {
$("#txt1").val(sesponseTest);
}
});
});
});
</script>
很简单，下面大概介绍下用到的各个属性和方法。 $(document).ready(function () {}; -------类似我们原来写的<body onload="loat();"> 页面加载方法。但是也有区别，具体请参考官方说明。
$("#btnSub").click(function () {}; -------按钮的单击事件。此处根据各自需要自行修改了。比如（$("#btnSub").focus(function () {}……)）等等。
$.ajax({}); -------ajax方法。
type： ------- 类型，此处为“POST” 还有 "GET"类型。
url： ------- 调用的Action 书写格式 /controller/action
data: ------- 参数，因为此处没有，所以我们为""
success: function (sesponseTest) {} ------- 回调函数，就是当我的Action 执行完后，执行的方法。sesponseTest为Action返回的内容。
$("#txt1").val(sesponseTest); ------- 把返回的字符串赋值给文本框。
4、下面就是我们最终实现效果：当我们单击按钮的时候，通过Ajax调用了后台的1个Action 并返回一个字符串给文本框赋值了。
二、带参数方法。
我们实际项目中可能经常会遇到界面中需要传递1个或多个参数给Action，最终返回结果给界面的情况。那接下来我们就来看下带参数的调用方法。
1、在原来的Action基础上我们稍作改动。
public ActionResult test1(string id)
{
return Content(id + "返回一个字符串");
}
这个Action需要一个参数id ，最后还是返回了一个字符画。
2、界面上我们再添加1个文本框。
<input type="text" id="txt1" name="txt1" /><br/>
<input type="text" id="txt2" name="txt2" /><br/>
<input type="button" id="btnSub" name="btnSub" value="调用Action" />
此处有2个文本框，我将实现：点击按钮的时候把文本框1中的内容传递到Action进行处理，最终把返回结果显示在文本框2中。
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$("#btnSub").click(function () {
var tvalue=$("#txt1").val();
$.ajax({
type: "POST",
url: "/Home/test1",
data: "id=" + tvalue,
success: function (sesponseTest) {
$("#txt2").val(sesponseTest);
}
});
});
});
</script>
细心的大家可能会发现，和上面无参数的就是多了点点改动。 这里的data: "id=" …… 带上了1个参数。id 就是我的Action 的参数的名称 id 。 然后把文本框1的值作为参数传递给Action.
多个参数呢，data的每个参数请用&&分开，如（data: "id=12345&&str=test",）……
注意这里的参数名称要和Action 的参数名称相同。
4、我们来看下最终效果。我们在文本框1中先输入内容，然后点击按钮，给文本框2赋值。
C#_ajax_demo的更多相关文章
随机推荐
- 【转】基于Android Fragment功能的例子
原文网址:http://blog.csdn.net/eyu8874521/article/details/8252216 通过最近空闲时候对Fragment的学习,尝试着写了一个小Demo,将在开发的 ...
- CSS预处理器Sass(Scss)、Less、Stylus
CSS 预处理编译器能让我成程序化其的方式编写CSS代码,可以引入CSS中没有的变量.条件.函数等特性,从而让代码更简单易维护,但一般按预处理器语法编写的代码无法直接在浏览器中运行,需用通过工具比如g ...
- C#第三方控件的使用
一.DEVEXPRESS的使用 官网:https://www.devexpress.com/ 入门教程:http://wenku.baidu.com/link?url=2sXEEby1ffx9JTWG ...
- 利用文件实现Free Pascal中的简单排序功能
此程序主要是验证文件功能的读写功能,总结到的东西有:①文件无论是读还是写,都要先建立链接关系才可以进行;②读与写不能同时进行,必须分开操作,这也可以理解,在实际鼠标操作时也是如此的!③读写后必须用cl ...
- JSP的笔记
JSP是一种特殊的Servlet,全称是java server page,属于服务器端语言 就JSP和Servle,HTML比较,三者的优缺点简略如下: Servlet: 缺点:不适合作为HTML的响 ...
- In place Merge(原地归并)
数组al[0,mid-1] 和 al[mid,num-1],都分别有序.将其merge成有序数组al[0,num-1],要求空间复杂度O(1) 思路:一般的归并是需要O(n)的空间,而这里要求空间复杂 ...
- NOIP2011 Mayan游戏
3 Mayan游戏 题目描述 Mayan puzzle是最近流行起来的一个游戏.游戏界面是一个 7 行5 列的棋盘,上面堆放着一些方块,方块不能悬空堆放,即方块必须放在最下面一行,或者放在其他方块之上 ...
- matlab 函数说明—ordfilt2
今天看harris角点实现的源码,在某一个版本中看到了这个函数,不是很理解,doc ordfilt2之后还是不清楚,终于在matlab论坛上搞清楚了ordfilt2的功能. 中文理解函数名就是顺序 ...
- DOS命令关闭进程
1.开始-运行,输入cmd后回车; 2.在DOS提示符下,先用命令 tasklist 回车来获取进程的 PID(例如获取了Explorer.EXE进程的PID为1988); 3.然后再输入命令:tas ...
- cocos2d-x的helloLua例子函数名定义误导初学者
初次研究cocos2d-x, cocos2d-x支持lua是一个很不错的功能,使用lua来开发有个最大的好处就是不用每次改了游戏代码都编译,大多数情况下改了脚本直接运行程序就可以了,发布更新时也不用更 ...