现在的位置: 首页 > 综合 > 正文

在.net 中,ajax 如何调用本页数据源

2012年02月12日 ⁄ 综合 ⁄ 共 7455字 ⁄ 字号 评论关闭

在.net 中,ajax 如何调用本页数据源

 

近来我发现我一些同事,在用ajax时,用数据源,都喜欢重新新建一个页面.其实我是很不喜欢这种模式,主要原因,一是后期维护麻烦,还要去找哪些页面,二是不能调用一些本页原有的数据方法.因此我在这里做了一个测试的案例,在这里,我们有2种方法来掉用本页的数据源方法. 一种是webservice 方法.  那就是在本页里添加webservice 方法.如下

 

    [WebMethod]
    public static string GetWord(string arg)
    {
        return "调用 webService,值是"+arg;
    }

 

这样就可以在客户端,前掉调用该方法了.如下

 var sdata = "{arg:'" + $("#txtVal").val() + "'}";
                $.ajax({
                    type: "POST",
                    contentType: "application/json;utf-8",
                    data: sdata,
                    //  dataType: "json",
                    url: "Default.aspx/GetWord",
                    success: function (msg) {
                        //  debugger;
                        //   var json = eval('(' + msg + ')');
                        alert(msg.d);
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        debugger;
                        alert("ok");
                        // 通常 textStatus 和 errorThrown 之中
                        // 只有一个会包含信息
                        // this; // 调用本次AJAX请求时传递的options参数
                    }

 

 

第二种是通过参数,来控制,是否调用数据源方法.

后台代码如下:

    protected void Page_Load(object sender, EventArgs e)
    {
        string methor = Request["act"];
        if (!string.IsNullOrEmpty(methor))
        {
            this.GetType().GetMethod(methor).Invoke(this,null);

          
        }
    }

    public void GetVal()
    {
        string val = "getVal 方法获取参数" + Request["arg"];
        Response.Clear();
        Response.Write(val);
        Response.End();
    }

这样也是一种好的数据源调用方法

在前台代码如下:

                var data = new Object();
                data.act = "GetVal";
                data.arg = $("#txtVal").val();

                $.post("Default.aspx", data, function (data) { alert(data); });

 

具体可以参考案例

 

 本来想把那项目,添加成附件的.但没找到那添加附件的方法,所以只能把代码全部copy出来

View Code

 1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.UI;
6 using System.Web.UI.WebControls;
7 using System.Web.Services;
8
9 public partial class _Default : System.Web.UI.Page
10 {
11 protected void Page_Load(object sender, EventArgs e)
12 {
13 string methor = Request["act"];
14 if (!string.IsNullOrEmpty(methor))
15 {
16 this.GetType().GetMethod(methor).Invoke(this,null);
17 }
18 }
19
20 public void GetVal()
21 {
22 string val = "getVal 方法获取参数" + Request["arg"];
23 Response.Clear();
24 Response.Write(val);
25 Response.End();
26 }
27
28 [WebMethod]
29 public static string GetWord(string arg)
30 {
31 return "调用 webService,值是"+arg;
32 }
33
34 }

 

 在前台,代码如下.只要引用jquery,就可以运行本代码了.

View Code

 1 <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
2
3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5 <html xmlns="http://www.w3.org/1999/xhtml">
6 <head runat="server">
7 <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
8 <title></title>
9 <script>
10 $(function () {
11
12 $("#btnWebservices").click(function () {
13 var sdata = "{arg:'" + $("#txtVal").val() + "'}";
14 $.ajax({
15 type: "POST",
16 contentType: "application/json;utf-8",
17 data: sdata,
18 // dataType: "json",
19 url: "Default.aspx/GetWord",
20 success: function (msg) {
21 // debugger;
22 // var json = eval('(' + msg + ')');
23 alert(msg.d);
24 },
25 error: function (XMLHttpRequest, textStatus, errorThrown) {
26 debugger;
27 alert("ok");
28 // 通常 textStatus 和 errorThrown 之中
29 // 只有一个会包含信息
30 // this; // 调用本次AJAX请求时传递的options参数
31 }
32
33 });
34 });
35
36 $("#btnPost").click(function () {
37 var data = new Object();
38 data.act = "GetVal";
39 data.arg = $("#txtVal").val();
40
41 $.post("Default.aspx", data, function (data) { alert(data); });
42
43 });
44
45 });
46
47 </script>
48 </head>
49 <body>
50 <form id="form1" runat="server">
51 <div>
52 <input id="txtVal" /> <input type="button" id="btnWebservices" value="webserrvices 调用" />
53 <input type="button" id="btnPost" value="post方法 调用" />
54 </div>
55 </form>
56 </body>
57 </html>

 

这是本人一些心得体会,希望大家多多交流,看看还有没有更好的方法来实现写ajax数据源

 

近来我发现我一些同事,在用ajax时,用数据源,都喜欢重新新建一个页面.其实我是很不喜欢这种模式,主要原因,一是后期维护麻烦,还要去找哪些页面,二是不能调用一些本页原有的数据方法.因此我在这里做了一个测试的案例,在这里,我们有2种方法来掉用本页的数据源方法. 一种是webservice 方法.  那就是在本页里添加webservice 方法.如下

 

    [WebMethod]
    public static string GetWord(string arg)
    {
        return "调用 webService,值是"+arg;
    }

 

这样就可以在客户端,前掉调用该方法了.如下

 var sdata = "{arg:'" + $("#txtVal").val() + "'}";
                $.ajax({
                    type: "POST",
                    contentType: "application/json;utf-8",
                    data: sdata,
                    //  dataType: "json",
                    url: "Default.aspx/GetWord",
                    success: function (msg) {
                        //  debugger;
                        //   var json = eval('(' + msg + ')');
                        alert(msg.d);
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        debugger;
                        alert("ok");
                        // 通常 textStatus 和 errorThrown 之中
                        // 只有一个会包含信息
                        // this; // 调用本次AJAX请求时传递的options参数
                    }

 

 

第二种是通过参数,来控制,是否调用数据源方法.

后台代码如下:

    protected void Page_Load(object sender, EventArgs e)
    {
        string methor = Request["act"];
        if (!string.IsNullOrEmpty(methor))
        {
            this.GetType().GetMethod(methor).Invoke(this,null);

          
        }
    }

    public void GetVal()
    {
        string val = "getVal 方法获取参数" + Request["arg"];
        Response.Clear();
        Response.Write(val);
        Response.End();
    }

这样也是一种好的数据源调用方法

在前台代码如下:

                var data = new Object();
                data.act = "GetVal";
                data.arg = $("#txtVal").val();

                $.post("Default.aspx", data, function (data) { alert(data); });

 

具体可以参考案例

 

 本来想把那项目,添加成附件的.但没找到那添加附件的方法,所以只能把代码全部copy出来

View Code

 1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.UI;
6 using System.Web.UI.WebControls;
7 using System.Web.Services;
8
9 public partial class _Default : System.Web.UI.Page
10 {
11 protected void Page_Load(object sender, EventArgs e)
12 {
13 string methor = Request["act"];
14 if (!string.IsNullOrEmpty(methor))
15 {
16 this.GetType().GetMethod(methor).Invoke(this,null);
17 }
18 }
19
20 public void GetVal()
21 {
22 string val = "getVal 方法获取参数" + Request["arg"];
23 Response.Clear();
24 Response.Write(val);
25 Response.End();
26 }
27
28 [WebMethod]
29 public static string GetWord(string arg)
30 {
31 return "调用 webService,值是"+arg;
32 }
33
34 }

 

 在前台,代码如下.只要引用jquery,就可以运行本代码了.

View Code

 1 <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
2
3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5 <html xmlns="http://www.w3.org/1999/xhtml">
6 <head runat="server">
7 <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
8 <title></title>
9 <script>
10 $(function () {
11
12 $("#btnWebservices").click(function () {
13 var sdata = "{arg:'" + $("#txtVal").val() + "'}";
14 $.ajax({
15 type: "POST",
16 contentType: "application/json;utf-8",
17 data: sdata,
18 // dataType: "json",
19 url: "Default.aspx/GetWord",
20 success: function (msg) {
21 // debugger;
22 // var json = eval('(' + msg + ')');
23 alert(msg.d);
24 },
25 error: function (XMLHttpRequest, textStatus, errorThrown) {
26 debugger;
27 alert("ok");
28 // 通常 textStatus 和 errorThrown 之中
29 // 只有一个会包含信息
30 // this; // 调用本次AJAX请求时传递的options参数
31 }
32
33 });
34 });
35
36 $("#btnPost").click(function () {
37 var data = new Object();
38 data.act = "GetVal";
39 data.arg = $("#txtVal").val();
40
41 $.post("Default.aspx", data, function (data) { alert(data); });
42
43 });
44
45 });
46
47 </script>
48 </head>
49 <body>
50 <form id="form1" runat="server">
51 <div>
52 <input id="txtVal" /> <input type="button" id="btnWebservices" value="webserrvices 调用" />
53 <input type="button" id="btnPost" value="post方法 调用" />
54 </div>
55 </form>
56 </body>
57 </html>

 

这是本人一些心得体会,希望大家多多交流,看看还有没有更好的方法来实现写ajax数据源

抱歉!评论已关闭.