[JQuery]Using JQuery Ajax

1. Loading JQuery and get it ready.

   <script type="text/javascript" src="Scripts/jquery-1.4.1.js">
   </script>
   <script type="text/javascript">
       $(document).ready(function
 () {

       });
   </script>

2.Select byId and alter a label

   <asp:Label ID="label" runat="server">Test</asp:Label>

   JQuery code:


   $(document).ready(function () {
       $("#MainContent_label").click(function () {
           $(this).html("hahaha");
       });
   });

 

3. Using JQuery get


<asp:Button ID="getBtn" runat="server" Text="GetButton" />
							

JQuery code:


  $("#MainContent_getBtn").click(function () {
      $.get("http://localhost:8088/TableTopic/myHandler.han"function (data) {
            alert("Data:" + data);
      });
  });

4. Post data to server


 $("#MainContent_getBtn").click(function () {
      $.post("http://localhost:8088/TableTopic/myHandler.han"
          {name:"John",time:"2pm"},
             function (data) {
                 alert("Data:" + data);
             });
       return false;
  });

5. The HttpHandler that handle the ajax call:

using System;
using System.Web;
using System.Web.Hosting;
using System.IO;

namespace Xhinker.TableTopic {
    public class MyHttpHandler:System.Web.IHttpHandler {
        public bool IsReusable {
            get { return true; }
        }

        public void ProcessRequest(HttpContext context) {
            var items = context.Request.Form;
            string path = HostingEnvironment.MapPath("~/test.txt");
            using (var writer = new StreamWriter(path)) {
                writer.WriteLine("hahahhaha goood");
                foreach (string item in items.Keys) {
                    writer.WriteLine(items[item]);
                }
            }
            context.Response.Write("save to server");
        }
    }
}

 

 

 

 

 

blog comments powered by Disqus