Jqeury ajax 调用C#的后台程序

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JQueryTest.aspx.cs" Inherits="自定义滚动条_JQueryTest" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title></title>
    <script src="jquery-1.8.3.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $("#btnOK").click(function() {
                $.ajax({
                    type: "Post",
                    url: "JQueryTest.aspx/SayHello",
                    data: "{}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function(data) {
                        alert(data.d);
                    },
                    error: function(err) {
                        alert(err);
                    }
                });
                return false;
            });
            $("#btnOK0").click(function() {
                $.ajax({
                    type: "Post",
                    url: "JQueryTest.aspx/GetStr",
                    data: "{‘str‘:‘我是‘,‘str2‘:‘XXX‘}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function(data) {
                        alert(data.d);
                    },
                    error: function(err) {
                        alert(err);
                    }
                });
                return false;
            });
            $("#btnOK1").click(function() {
                $.ajax({
                    type: "Post",
                    url: "JQueryTest.aspx/GetArray",
                    data: "{}",
                    contentType: "application/json; chartset=utf-8",
                    dataType: "json",
                    success: function(data) {
                        $("#list").html("");
                        $(data.d).each(function() {
                            $("#list").append("<li>" + this + "</li>");
                        });
                        alert(data.d);
                    },
                    error: function(err) {
                        alert(err);
                    }
                });
                return false;
            });
            $("#btnOK2").click(function() {
                $.ajax({
                    type: "Post",
                    url: "JQueryTest.aspx/GetHash",
                    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;
            });
            $("#btnOK3").click(function() {
                $.ajax({
                    url: "XMLTest.xml",
                    dataType: ‘xml‘,
                    success: function(xml) {
                        $("#list1").html("");
                        $(xml).find("data>item").each(function() {
                            $("#list1").append("<li>id:" + $(this).find("id").text() + "</li>");
                            $("#list1").append("<li>name:" + $(this).find("name").text() + "</li>");
                        })
                    },
                    error: function(result, status) {
                        alert(status);
                    }
                });
                return false;
            });
        });   

 </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="btnOK" type="button" value="button" />
        <input id="btnOK0" type="button" value="button" />
        <input id="btnOK1" type="button" value="button" />
        <input id="btnOK2" type="button" value="button" />
        <input id="btnOK3" type="button" value="button" />
        <ul id="list"></ul>
        <ul id="list1"></ul>
    </div>
    </form>
</body>
</html>  

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Script.Services;
using System.Web.Services;
using System.Collections;  

public partial class 自定义滚动条_JQueryTest : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {  

        }  

        [WebMethod]
        public static string SayHello()
        {
            return "Hello Ajax";
        }  

        [WebMethod]
        public static string GetStr(string str, string str2)
        {
            return str + str2;
        }  

        [WebMethod]
        public static List<string> GetArray()
        {
            List<string> li = new List<string>();
            for (int i = 0; i < 10; i++)
            {
                li.Add(i + "");
            }
            return li;
        }  

        [WebMethod]
        public static Hashtable GetHash(string key, string value)
        {
            Hashtable hs = new Hashtable();
            hs.Add("www", "yahooo");
            hs.Add(key, value);
            return hs;
        }
    }
 
时间: 2024-08-03 06:47:34

Jqeury ajax 调用C#的后台程序的相关文章

ajax 调用asp.net后台方法

ajax 调用asp.net后台方法  这种做法有好几种,如调用xx.asxh 页面,或者直接调用xx.aspx也面,在page_Load中进行一些判断然后调用后面的其他方法, 或者你可以直接调用webservice: 今天我简单总结一中方法,前提是:net Framework 4.0以上的版本才支持滴呀(包括4.0),也就是说:2.0 和 3.0 都不支持滴呀 前端写法: <%@ Page Language="C#" AutoEventWireup="true&quo

.Net中jQuery.ajax()调用asp.net后台方法 总结

利用JQuery的$.ajax()调用.Net后台方法有多种方式, 不多说了  直接上代码 前台代码 1 <script type="text/javascript"> 2 3 $(document).ready(function () { 4 getTreeData(getData()); 5 }); 6 7 //获取ajax调用传参方法 8 function getData() { 9 var data = {}; 10 data.username = "an

JQuery Ajax调用asp.net后台方法

出处:http://www.cnblogs.com/kingboy2008/ 利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. 先来个简单的实例热热身吧. 1.无参数的方法调用 asp.net code: 1 2 3 4 5 6 7 using System.Web.Script.Services;      [WebMethod]   public static string SayHello()   {        return "Hello Ajax!&quo

Ajax——ajax调用数据总结

在做人事系统加入批量改动的功能中,须要将前台中的数据传给后台.后台并运行一系列的操作. 通过查询和学习了解到能够通过ajax将值传入到后台,并在后台对数据进行操作. 说的简单点.就是ajax调用后台的方法.通过学习和实践.学习了几种ajax调用数据的几种形式,如今总结一下: 1.  Ajax调用无參的后台方法的数据 Jquery前台代码: //ajax调用无參数后台方法 $(function () { $("#btnok").click(function () { $.ajax({ t

仅用aspx文件实现Ajax调用后台cs程序。(实例)

仅用aspx文件实现Ajax调用后台cs无刷新程序.(实例) 两个文件:aaa.aspx 和aaa.aspx.cs 一.aaa.aspx <script type="text/javascript"> function Request() { alert("1"); $.ajax({ type: 'post', url: 'Test442.aspx?method=Send2', // [调用后台的事件] cache: false, success: fu

C#后台程序与HTML页面中JS方法互调(功能类似于Ajax中的DWR)

此方法适用于 C#中嵌入WebBrowser(浏览器) 通过浏览器中加载的页面与C#的后台代码进行交互. 一.C#程序 1.在C#窗体中添加WebBrowser(浏览器),将页面的URL添加到浏览器中. 2.窗体代码添加 using System.Runtime.InteropServices;//和Html页面交互使用 在类的上一行添加 [ComVisible(true)]//和Html页面交互使用 在类的构造其中添加 this.webB.ObjectForScripting = this;

Ajax调用后台action返回JSONArray(JSONObject)类型实现jsp中下拉列表的动态显示

一.描述 现在有个jsp页面上有一个所属学校和一个所属班级的下拉列表,只有在选择所属学校后才弹出所属班级列表,所以采用Ajax技术返回一个ArrayList类型的键值对显示在所属班级列表中,效果如图1所示: 二.源代码 1.main.jsp主要源代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@

webform中 ajax调用后台方法(非webservice)

后台: public partial class Ajax_ShoppingCart : System.Web.UI.Page { bookdbDataContext bdc = Connect.bookdb(); protected void Page_Load(object sender, EventArgs e) { if(!IsPostBack) { if(Request.Form["method"]!=null) { switch (Request.Form["me

thinkjs学习-this.assign传递数据和ajax调用后台接口

在页面加载时,就需要显示在页面上的数据,可以在后台使用this.assign赋值,在前台通过ejs等模板获取:用户点击按钮,或者触发某些事件和后台进行交互时,就需要用到ajax调用后台接口.本文通过一个例子讲述这两种方法的前后台实现.(方便起见,使用jQuery封装的ajax)' (ps:ajax调用后台接口的情形通常是用户触发事件,给后台传递一些前台的数据,然后后台根据这些数据进行相关操作,再返回前台一些数据.举个表单提交的例子,用户点击提交按钮之后,将填写的表单信息传递个后台,后台对传过来的