jquery ajax .net使用

jquery是一个优秀的javascript框架,大大提高了javascript代码的简洁性,同时也降低了javascript的难度。关于具体的jquery函数请参考http://www.cnblogs.com/greatxj/articles/2260357.html。对于jquery中的ajax,我主要使用了ajax()这个函数,下面就写一点使用心得,有什么不足之处向大家多多请教了。后台代码为C#
1.对一个表添加数据
前台代码
1$.ajax({
2type:"POST",//访问WebService使用Post方式请求
3contentType:"application/json",//WebService会返回Json类型
4url:"ajax.aspx/AddToTP",//调用WebService的地址和方法名称组合----WsURL/方法名
5data:'{tid:"'+tid+'",uid:"'+uid+'",score:"'+score+'",degree:"'+degree+'"}',//这里是要传递的参数,格式为data:"{paraName:paraValue}",下面将会看到
6dataType:'json',
7success:function(result){//回调函数,result,返回值
8alert(result.d);//弹出ajax请求成功后,后台的返回值
9if(result.d=="success"){
10
11//成功事件
12}
13}

14});
c#接收ajax请求可以用.aspx,或者.ashx(一般事务处理程序) ,这里使用.aspx中的web服务。

1[System.Web.Services.WebMethod()]
2publicstaticstringAddToTP(stringtid,stringuid,stringscore,stringdegree)
3{
4boolok=DBHpler.ExecuteNonQueryTwo("Insertintotrainingpeople(tid,uid,score,degree)Values('"+tid+"','"+uid+"','"+score+"','"+degree+"')");//使用sql帮助类,对表trainingpeople插入数据
5if(ok==true){return"success";}//对DBHpler.ExecuteNonQueryTwo返回值判断
6else{return"failed";}
7}

2.当用户点击按钮时,ajax请求返回用户选择班级的人员表单,并对表单格式化,此处模拟的为对班级测试输入成绩,用户可选择直接输入分数,或者是二级制
前台js代码
scriptlanguage="javascript"type="text/javascript"

functiongetPeople(){
$('#progress').css('visibility','visible');//loading图片显示
$.ajax({
type:"POST",//访问WebService使用Post方式请求
contentType:"application/json",//WebService会返回Json类型
url:"ajax.aspx/GetPeople",//调用WebService的地址和方法名称组合----WsURL/方法名
data:'{unit:"'+$('#Select1').val()+'"}',//这里是要传递的参数为用户下拉框中选择的值,此处为用户选择的某个子单位
dataType:'json',
success:function(data){//回调函数,result,返回值
$('.dd').empty();//对divclass="dd"清空
$('.dd').append(data.d);//对divclass="dd"填写ajax返回值

$('#progress').css('visibility','hidden');//loading图片隐藏
varss=$('#Select3option:selected').val();
//根据用户选择的值格式化表单
if(ss=="score"){
$('.dd.scoretxt').each(function(i){
$($('.dd.scoretxt')[i]).append('inputtype="text"class="score"/');
});

}
else{

$('.dd.scoretxt').each(function(i){
$($('.dd.scoretxt')[i]).append('selectclass="score"optionvalue="合格"合格/optionoptionvalue="不合格"不合格/optionoptionvalue="未测"未测/option/select');
});

}

}
});
}
/script


后台代码
ajax.aspx中
[System.Web.Services.WebMethod()]

publicstaticstringGetPeople(stringunit)

{

System.Threading.Thread.Sleep(500);//延迟0.5秒

Pagepage=newPage();

UserScoreInputctl=(UserScoreInput)page.LoadControl("~\\Samples\\UserScoreInput.ascx");//加载表单控件

ctl.unit=unit;//传递给表单控件的参数



page.Controls.Add(ctl);

System.IO.StringWriterwriter=newSystem.IO.StringWriter();

HttpContext.Current.Server.Execute(page,writer,false);

stringoutput=writer.ToString();

writer.Close();

returnoutput;



15}
用户控件

UserScoreInput.ascx代码
1%@ControlLanguage="C#"AutoEventWireup="true"Inherits="UserScoreInput"ClassName="UserScoreInput"%
2
3scriptrunat="server"
4protectedoverridevoidOnLoad(EventArgse)
5{
6
7
8if(int.Parse(this.unit)1000)
9sqlDsOrders.SelectCommand="SELECT[ID],[name]FROM[personnel]WHEREunit='"+this.unit+"%'";
10
11base.OnLoad(e);
12}
13
14
15/script
16//此处采用两列重复
17asp:SqlDataSourceID="sqlDsOrders"runat="server"ConnectionString="%$ConnectionStrings:ConnectionString%"
18/asp:SqlDataSource
19asp:RepeaterID="List"DataSourceID="sqlDsOrders"runat="server"
20HeaderTemplate
21tablestyle="width:80%"
22tr
23th姓名/th
24th成绩/th
25th姓名/th
26th成绩/th
27/tr
28/HeaderTemplate
29ItemTemplate
30tr
31tdstyle="width:25%"
32divclass="hh"%#Eval("name")%/div
33/td
34tdstyle="width:25%"
35divclass="scoretxt"name='%#Eval("id")%'
36/td
37
38/ItemTemplate
39AlternatingItemTemplate
40
41tdstyle="width:25%"
42divclass="hh"%#Eval("name")%/div/td
43
44tdstyle="width:25%"
45divclass="scoretxt"name='%#Eval("id")%'
46/td
47/tr
48/AlternatingItemTemplate
49FooterTemplate
50/table
51/FooterTemplate

52/asp:Repeater
UserScoreInput.ascx.cs代码
1publicpartialclassUserScoreInput:UserControl
2{
3publicstringunit
4{
5get{return(string)ViewState["unit"];}
6set{ViewState["unit"]=value;}
7}
8
9}

有什么不足之处请大家留言,共同学习。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值