TOC

This article is currently in the process of being translated into Persian (~58% done).

The Basics:

Hello, world!

As usual, we will use the good old "Hello, world!" as our very first example. We will begin with the code, and then we'll do a bit of explanation afterwards. If you haven't already done so, you should create a new ASP.NET website project in Visual Studio Express 2012. The IDE will create a Default.aspx and Default.aspx.cs file for you, which will look just like any other ASP.NET enabled page. Let's add some AJAX to it:

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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 runat="server">
    <title>Hello, world!</title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="MainScriptManager" runat="server" />
        <asp:UpdatePanel ID="pnlHelloWorld" runat="server">
            <ContentTemplate>
                <asp:Label runat="server" ID="lblHelloWorld" Text="Click the button!" />
                <br /><br />
                <asp:Button runat="server" ID="btnHelloWorld" OnClick="btnHelloWorld_Click" Text="Update label!" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
</body>
</html>

در پس این کد هیچ چیز جدیدی نیست جز این رویداد که باید اضافه کنید:

protected void btnHelloWorld_Click(object sender, EventArgs e)
{
    lblHelloWorld.Text = "Hello, world - this is a fresh message from ASP.NET AJAX! The time right now is: " + DateTime.Now.ToLongTimeString();
}

در این قسمت ما از دو کنترل جدید در مقایسه با ASP.NET معمولی استفاده می کنیم : کنترل ScriptManager و کنترل UpdatePanel. ScriptManager اطمینان حاصل میکند فایلهای مورد نیاز ASP.NET AJAX موجودند و پشتیبانی AJAX اضافه شده و این تنظیمات را به هر صفحه ای که در آن از قابلیت های AJAX استفاده شده اضافه میکند.

After the manager, we have one of the most used controls when working with AJAX, the UpdatePanel. This control allows you to wrap markup which you would like to allow to be partially updated, that is, updated without causing a real postback to the server. More about the UpdatePanel in a coming chapter. Besides those two controls, everything else is standard controls, with no modifications that would indicate alternate behavior.

سایت نمونه را اجرا کنید و روی دکمه کلیک کنید. برچسب با متن متداول "سلام دنیا" و زمان فعلی به روز می شود. بارها و بارها بر روی دکمه کلیک کنید ، و خواهید دید که هر بار برچسب زمان جاری را نمایش میدهد.توجه کنید که پنجره چشمک زن و نوار وضعیت در حال اجرا وجود ندارد. تمام عملیات فقط با بروزرسانی برچسب انجام میشود! ما اولین صفحه با AJAX فعال را ایجاد کرده ایم اگر می خواهید ببینید که چگونه این صفحه بدون AJAX کار می کند ، سعی کنید "activpartialrendering" را از ScriptManager به صورت زیر تنظیم کنید:

<asp:ScriptManager ID="MainScriptManager" runat="server" enablepartialrendering="false" />

استفاده از این کد رندر جزئی را در صفحه غیرفعال میکند و شما میبینید که چگونه بدون AJAX این عمل انجام میشود.

در فصل های بعدی به بررسی کنترلر های مختلف AJAX و نحوه استفاده از آنها خواهیم پرداخت.


This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!