Complete Ajax and three-level linkage exercises

Ajax Architecture:

 varName = $ ("#text_1"). Val (); $.ajax ({URL:"Ashxs/handler.ashx",//Generic Handler pathData: {"name": Name},//The data to be transferred, preceded by the key name is the data to be transferred, if there are multiple pieces of data in curly braces with commas in the concatenationType: "Post",//transmission ModeDataType: "JSON",//Return Data typeSuccessfunction(HAS) {//has is custom and must have                  if(Has.hasname = = "1") {//Hasname is the key name of the generic handler that returns data$ ("#span_1"). Text ("User name already exists!") "); }                 Else {                     $("#span_1"). Text ("User name available! "); }}); Error:function(){    //The server is not connected or there is an error in the content, just go here.    //you can usually use this thing to make mistakes .}beforesend:function(){    //when Ajax executes, it immediately executes this method}complete:function(){    //the success or the error in Ajax executes, and immediately executes here .}

JSON basic structure:

"{\ "hasname\": \ "1\"}""[{"Name":"Zhangsan","Pwd":"1234"},{"Name":"Lisi","Pwd":"12345"}]"//Is a string, preceded by the key name is the data, if there are multiple pieces of data with commas, and then enclosed in English brackets

three-level linkage small exercise :

General handlers:

 1Dataclassesdatacontext DC =NewDataclassesdatacontext ();2      Public voidProcessRequest (HttpContext context)3     { 4         intCount =0; 5         stringEnd ="["; 6         varList = DC. Chinastates.where (r = R.parentareacode = = Context. request["Pplace"]); 7         foreach(Chinastates Cinchlist)8         { 9             if(Count = =0)Ten             { OneEnd + ="{\ "place\": \ ""+ C.areaname +"\ ", \" pcode\ ": \""+ C.areacode +"\"}"; A             } -             Else -             { theEnd + =", {\ "place\": \ ""+ C.areaname +"\ ", \" pcode\ ": \""+ C.areacode +"\"}"; -             } -count++; -         } +End + ="]"; -Context. Response.Write (end);

HTML page:

<SelectID= "Select_1" ></select>         <SelectID= "Select_2" ></select>         <SelectID= "Select_3" ></select>               <Script>$.ajax ({URL:"Ashxs/handler2.ashx", data: {"Pplace": "0001"}, type:"POST", DataType:"JSON", Success:function(DA) { for(Iinchda) {                 varOP =NewOption (Da[i].place, Da[i].                 Pcode); $("#select_1"). Get (0). Add (OP);         } Place1 (); }     });//Show all provincial data$ ("#select_1"). Change (function() {Place1 ()}); $("#select_2"). Change (function() {Place2 ()}); functionPlace1 () {$ ("#select_2"). empty (); $.ajax ({URL:"Ashxs/handler2.ashx", data: {"Pplace": $ ("#select_1"). Val ()}, type:"POST", DataType:"JSON", Success:function(DA) { for(Iinchda) {                     $("#select_2"). Get (0). Add (NewOption (Da[i].place, Da[i].                 Pcode));             } place2 ();     }         }); }//Display city-level data     functionPlace2 () {$ ("#select_3"). empty (); $.ajax ({URL:"Ashxs/handler2.ashx", data: {"Pplace": $ ("#select_2"). Val ()}, type:"POST", DataType:"JSON", Success:function(DA) { for(Iinchda) {                     $("#select_3"). Get (0). Add (NewOption (Da[i].place, Da[i].                 Pcode));    }             }         }); }//Show County Data</script>

Complete Ajax and three-level linkage exercises