.netとajaxを学ぶ詳細な事例まとめ

まず、ajax とは何かを理解します。

AJAX は新しいプログラミング言語ではなく、より優れた、より高速で、よりインタラクティブな Web アプリケーションを作成するためのテクノロジーです。
AJAX を使用すると、JavaScript の XMLHttpRequest オブジェクトを使用して、JavaScript がサーバーと直接通信できます。このオブジェクトにより、JavaScript はページをリロードせずに Web サーバーとデータを交換できるようになります。
AJAX はブラウザと Web サーバーの間で非同期データ転送 (HTTP リクエスト) を使用します。これにより、Web ページはページ全体ではなく少量の情報をサーバーに要求できます。

JavaScript に関して言えば、誰もがブラウザーの互換性の問題を思い浮かべるでしょう。実際、ajax もこの問題を考慮する必要があります。ブラウザごとに使用される Web JavaScript クラスが異なるため、生成される効果は同じではありません。以下はナンセンスではありません。参考のためにコードを直接紹介するだけです。 {var xmlhttp; // xmlhttp.open("POST", "GetDate.ashx?nd=" + new Date( ), false); // サーバー上のページにリクエストを送信します
xxxxx = xmlhttp.res ponseText;//ここでここで、HTML タグに渡したパラメータやその他の変数処理の問題を返すことができます
using using using using using using ‐ through using through through through ' s through ‐ to ‐ ‐‐‐‐‐ and } //responseText はテキストですサーバーによって返されました

}
それは場合によるので、ここで紹介する必要はありません。

これらのコードを見てどう思いますか? JavaScript や Ajax を学んだばかりの学生にとって、これらのコードをどのように理解しますか? 基本的には誰でも理解できます。しかし、各ページを部分的に更新する必要がある場合、そのようなコードを各ページに記述するのは非常に面倒に感じられるでしょう。jQuery を使用すると、プロジェクトの開発の困難さが軽減されます。 jQuery コードを使用します:

$.ajax({

type: "POST",

URL: "some.php",

data: "name=John&location=Boston",
success: function(msg){
alert( "保存されたデータ: " + msg );
}
});別の方法

$.post("test.php", { 名前: "ジョン"、時刻: "午後 2 時" },
function(data){

アラート("Data Loaded: " + data);

}); ここでは彼が書いた関数を呼び出していますが、これでは役に立たないように感じます。ページを更新するのは非常に簡単ですが、小さなデータを渡すだけです。データベースからデータを抽出するのは非常に面倒です。これは、皆さんに考えてもらうためのコードの一部です

以下は、私の実装です。更新 フロントエンドとバックエンドのコードにコメントして表示します:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxComment.aspx.cs" Inherits="ajax learning.Nofresh comment.AjaxComment1 " %>

DeleteMethod="Delete" InsertMethod="Insert"
OldValuesParameterFormatString="original_{0}" SelectMethod="GetData"
TypeName="ajax学习.DataSetCommentTableAdapters.T_CommentTableAdapter"
UpdateMethod="更新" >






               
           
           
               
               
               
               
           
       
       

       
           
               
• 评论日期:<%#Eval("PostDate")%>,IP:<%#Eval("IP")%>,内容：<%#Eval("Msg")%>
  

           
       
       

   

    value="提交" />
   

バックエンド コード (AjaxComment.ashx)

System を使用;
System.Collections.Generic を使用;
System.Linq を使用;
System を使用.Web;
using ajax learning.DataSetCommentTableAdapters;
using System.Web.Services;
namespace ajax learning.更新コメントはありません
{
///

/// AjaxComment の概要説明
/// < /summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class AjaxComment: IHttpHandler
{

public void ProcessRequest(Http Context context)
{
context.Response.ContentType = "text/plain";
string msg = context.Request["msg"]; ;
フロントエンドのコードに問題がある場合はどうすればよいですか?多くのフィールドと属性を含むデータを渡すにはどうすればよいですか? このようにすべてのデータを分割すると、大きなプロジェクトを実行する場合は間違いなく疲れます。これは、json の使用です。非更新コメントを使用するための JSON コードを紹介します

フロントエンド コード:

< html xmlns="http://www.w3.org/1999/xhtml">

< /tr>

後台代：

System の使用;
System.Collections.Generic の使用;
System.Linq の使用;
System.Web の使用;
System.Web.Services の使用;
ajax 学习.DataSetCommentTableAdapters の使用;
System.Web.Script.Serialization の使用;
namespace ajax 学习.無刷新分页
{
///

/// PagedServices 的摘要说明
///

[WebService(Namespace = "http://tempuri.org/" )]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class PagedServices : IHttpHandler
{

public void ProcessRequest(HttpContext context)
{
コンテキスト。 Response.ContentType = "text/plain";
// コンテキスト。 Response.Write("Hello World");
string action=context.Request["action"];
varadapter = new T_CommentTableAdapter();
if (action == "getpagecount")
{

int count=アダプター.SelectCount().Value;
int pagecount=count/10;
if(count%10!=0)
{
pagecount++;
}
context.Response.Write(pagecount);
}
else if(action= ="getpagedata")
{
string pagenum=context.Request["pagenum"];
int iPageNum = Convert.ToInt32(pagenum);
var data =adapter.GetP oldData((iPageNum - 1) * 10 + 1, iPageNum * 10);
リスト<コメント> list=新しいリスト<コメント> ();
foreach(var row in data)
{
list.Add(new Comments() { Id = (int)row.Id、IP = row.IP、Msg = row.Msg、PostDate = row.PostDate、 });
}
JavaScriptSerializer jss = new JavaScriptSerializer();
context.Response.Write(jss.Serialize(list));
}
}

public bool IsReusable
{
get
{
return false;
}
}
}

    public class Comments
    {
        public int Id { get; set; }
        public string IP{get;set;}
        public string Msg{get;set;}
        public string PostDate{get;set;}
    }
}这样我们真的是省了很多力气啊，是不是jQuery很强大啊。。。。。。。。。。。。。

然后吧，微软感觉我必须封装自己的ajax，这样使得开发者做项目变得容易一些，微软真的是帮我们封装好了一个，但是对于高手来说，大家都不想用，感觉这样的代码太呆板，一点不灵活，我再下面引入代码，供新手参考：（不了解ajax运行原理的新手一样可以使用ajax快速开发新的项目）

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UpdatPanel.aspx.cs" Inherits="ajax学习.UpdatePanel.UpdatPanel" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="cc1" %>

   


   

   
   
   

       
        onclick="Button1_Click" />
   

   

  
       
           
                Text="Ajax无刷新显示当前时间" />
               

           
       
   

   

但是微软后来真的是开发一个很好地工具，那就是ajax与WCF的结合，废话少说，引入代码，供大家思考

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WCF_Ajax.aspx.cs" Inherits="ajax学习.WCF之Ajax.WCF_Ajax" %>

   
   
   


   

   

   
       
           
                //注意路径处理问题，
           
       
       
       
       

   
   

バックエンド コード: (PersonService.svc)

System を使用;
System.Collections.Generic を使用;
System.Linq を使用;
System を使用。 Runtime.Serialization;
System.ServiceModel の使用;
System.ServiceModel.Activation の使用;
System.ServiceModel.Web の使用;
System.Text の使用;

名前空間 ajax learning.WCF の Ajax
{
「」)]
[AspNetCompatibilityRequirements( requictionMode = aspNetCompatibilityRequirementsMode.Allowed）]
public classpersonService
{
(デフォルトの ResponseFormat は WebMessageFormat.Json です) WebOperationContext .Current.outcomingResponse.ContentType = "Text/X ML"; Ontract] u Public person Getperson (int id)
{
public string Name { get; .netを使用して中国のウェブサイトを使用してください！