asp.net里利用ajax和jquery将前台的值,传给后台查询数据库,再将查询结果返到前台。

例如:在前台获取了一个值 “D11”
如何将D11传给后台.ashx文件里通过语句select * from table where ID="D11";
再将给过返回给前台。
这个语句怎么写啊。
怎样将D11传递到后台去啊!

ajax设置一个url和post/get方法,然后写一个函数接受状态码==200处理。js是这样的

 1》前台
首先需要 Jquery的包
复制代码 代码如下:

<script src="js/jquery-1.9.1.js" type="text/javascript"></script>
下面是     <script type="text/javascript">
        $(function () {
            $('#txtUserName').blur(function () {
                var username = $(this).val();
                $.ajax({
                    type: "post",
                    contentType: "application/json",//传值的方式
                    url: "WebAjaxForMe.aspx/GetValueAjax",//WebAjaxForMe.aspx为目标文件,GetValueAjax为目标文件中的方法
                    data: "{username:'" + username + "'}",//username 为想问后台传的参数(这里的参数可有可无)
                    success: function (result) {
                        alert(result.d);//result.d为后台返回的参数
                    }
                })
            })
        })
    </script>
//这里是参数的来源
        <input id="txtUserName" type="text" />

2》后台
在后台首先要添加using System.Web.Services;的引用
复制代码 代码如下:

[WebMethod]//方法前边必须添加 [WebMethod]      
  public static string GetValueAjax(string username)//这个方法需要是静态的方法要用到关键字static       
{
            //在这里可以对传进来的参数进行任何操作           
    return username;    
 }

1、无参数的方法调用, 注意:1.方法一定要静态方法,而且要有[WebMethod]的声明
后台:

using System.Web.Script.Services;

[WebMethod]

public static string SayHello()

{

return "Hello Ajax!";

}
前台:

$(function() {

$("#btnOK").click(function() {

$.ajax({

//要用post方式

type: "Post",

//方法所在页面和方法名

url: "data.aspx/SayHello",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(data) {

//返回的数据用data.d获取内容

alert(data.d);

},

error: function(err) {

alert(err);

}

});

    //禁用按钮的提交   
    return false;   
});   

});

2、带参数的方法调用
后台:

using System.Web.Script.Services;

[WebMethod]
public static string GetStr(string str, string str2)
{
return str + str2;
}
前台:
$(function() {

$("#btnOK").click(function() {

$.ajax({

type: "Post",

url: "data.aspx/GetStr",

//方法传参的写法一定要对,str为形参的名字,str2为第二个形参的名字

data: "{'str':'我是','str2':'XXX'}",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(data) {

//返回的数据用data.d获取内容

alert(data.d);

},

error: function(err) {

alert(err);

}

});

    //禁用按钮的提交   
    return false;   
});   

});
3、返回数组方法的调用
后台:

using System.Web.Script.Services;

[WebMethod]
public static List GetArray()
{
List li = new List();

for (int i = 0; i < 10; i++)
    li.Add(i + "");

return li;

}
前台:

$(function() {

$("#btnOK").click(function() {

$.ajax({

type: "Post",

url: "data.aspx/GetArray",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(data) {

//插入前先清空ul

$("#list").html("");

            //递归获取数据   
            $(data.d).each(function() {   
                //插入结果到li里面   
                $("#list").append("<li>" + this + "</li>");   
            });   

            alert(data.d);   
        },   
        error: function(err) {   
            alert(err);   
        }   
    });   

    //禁用按钮的提交   
    return false;   
});   

});
///
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: "Post",
url: "data.aspx/GetArray",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
//插入前先清空ul
$("#list").html("");

            //递归获取数据
            $(data.d).each(function() {
                //插入结果到li里面
                $("#list").append("<li>" + this + "</li>");
            });

            alert(data.d);
        },
        error: function(err) {
            alert(err);
        }
    });

    //禁用按钮的提交
    return false;
});

});
4、返回Hashtable方法的调用
后台:

using System.Web.Script.Services;
using System.Collections;

[WebMethod]
public static Hashtable GetHash(string key,string value)
{
Hashtable hs = new Hashtable();

hs.Add("www", "yahooooooo");
hs.Add(key, value);

return hs;

}
前台:

$(function() {

$("#btnOK").click(function() {

$.ajax({

type: "Post",

url: "data.aspx/GetHash",

//记得加双引号 T_T

data: "{ 'key': 'haha', 'value': '哈哈!' }",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(data) {

alert("key: haha ==> "+data.d["haha"]+"\n key: www ==> "+data.d["www"]);

},

error: function(err) {

alert(err + "err");

}

});

    //禁用按钮的提交   
    return false;   
});   

});
5、操作xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
XMLtest.xml:

view plaincopy to clipboardprint?
<?xml version="1.0" encoding="utf-8" ?>


1
qwe


2
asd


<?xml version="1.0" encoding="utf-8" ?>


1
qwe


2
asd


前台:

$(function() {

$("#btnOK").click(function() {

$.ajax({

url: "XMLtest.xml",

dataType: 'xml', //返回的类型为XML ,和前面的Json,不一样了

success: function(xml) {

//清空list

$("#list").html("");

//查找xml元素
$(xml).find("data>item").each(function() {

$("#list").append("

id:" + $(this).find("id").text() +"");

$("#list").append("Name:"+ $(this).find("name").text() + "");

})

},

error: function(result, status) { //如果没有上面的捕获出错会执行这里的回调函数

alert(status);

}

});
    //禁用按钮的提交   
    return false;   
});   

});

jquery load方法就行

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<div id="div"></div>
<script>
    $('#div').load('xxxx.aspx?v=D11');
</script>

xxxx.aspx.cs

 protected void Page_Load(object sender,EventArgs e){
   string v=Request.QueryString["v"];
   string sql="select * from table where ID='"+v+"'";
///查询操作,然后输出结果html代码就行
Response.End();//技术其他内容输出
}