14-10-12, 11:21 PM
كاتب الموضوع : أحمد جمال
بسم الله الرحمن الرحيم .السلام عليكم ورحمة الله وبركاته .
في هذا الدرس الأخير حول ASP.net سنستعرض سريعاً كيفية الاستفادة من خدمات تقنية الإنترنت المعروفة باسم AJAX من خلال .net .
بداية ، راجع درسي على هذا الرابط :
http://www.vb4arab.com/vb/showthread.php?t=15
والآن ، سنبدأ في عمل تطبيقنا الأول ...
جرب عمل مربع نص لتعرض فيه الوقت الحالي ، ايضاً قم باضافة صورة لتستطيع تمميز تحديث الصفحة ، ومن ثم قم بكتابة الكود التالي في زر الأمر :
C#:
كود :
TextBox1.Text = DateTime.Now.ToString();
كود :
TextBox1.Text = DateTime.Now.ToString()
لذا قم بداية باضافة ScroptManager من ضمن ادوات اجاكس بالشكل التالي :
الآن قم بسحب UpdatePanel ، وقم بوضع مربع النص وزر الأمر بداخلها مع ترك الصورة فقط في الخارج ، سيكون كود الصفحة بالشكل التالي :
كود :
[color=#000080]<%@ Page Language=[COLOR=#0000ff]"C#"[/color] AutoEventWireup=[color=#0000ff]"true"[/color] CodeFile=[color=#0000ff]"Default6.aspx.cs"[/color] Inherits=[color=#0000ff]"Default6"[/color] %>[/COLOR]
[color=#000080]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/color]
[color=#000080]<html xmlns=[COLOR=#0000ff]"http://www.w3.org/1999/xhtml"[/color]>[/COLOR]
[color=#000080]<head runat=[COLOR=#0000ff]"server"[/color]>[/COLOR]
[color=#000080]<title>[/color]Untitled Page[color=#000080]</title>[/color]
[color=#000080]</head>[/color]
[color=#000080]<body>[/color]
[color=#ff8000]<form id=[COLOR=#0000ff]"form1"[/color] runat=[color=#0000ff]"server"[/color]>[/COLOR]
[color=#000080]<div>[/color]
[color=#800080]<img src=[COLOR=#0000ff]"images/food.jpg"[/color] />[/COLOR]
[color=#000080]<asp:UpdatePanel runat=[COLOR=#0000ff]"server"[/color]>[/COLOR][color=#000080]<ContentTemplate>[/color]
[color=#000080]<br />[/color]
[color=#000080]<br />[/color]
[color=#000080]<asp:TextBox ID=[COLOR=#0000ff]"TextBox1"[/color] runat=[color=#0000ff]"server"[/color]>[/COLOR][color=#000080]</asp:TextBox>[/color]
[color=#000080]<br />[/color]
[color=#000080]<asp:Button ID=[COLOR=#0000ff]"Button1"[/color] runat=[color=#0000ff]"server"[/color] onclick=[color=#0000ff]"Button1_Click"[/color]
Text=[color=#0000ff]"ShowTime"[/color] />[/COLOR]
[color=#000080]</ContentTemplate>[/color][color=#000080]</asp:UpdatePanel>[/color]
[color=#000080]</div>[/color]
[color=#ff8000]</form>[/color]
[color=#000080]</body>[/color]
[color=#000080]</html>[/color]
جميل ، الآن سنحاول تطبيق موضوع آخر ماذا لو افترضنا اننا نريد وضع زر الامر خارج ال update panel بحيث لا يتم تحديثه ، هذا ممكن .
فقط اسحب زر الأمر خارج ال update Panel ، وقم بكتابة الكود التالي داخل ال update panel :
كود :
[color=#000080]<Triggers>[/color]
[color=#000080]<asp:AsyncPostBackTrigger ControlID=[COLOR=#0000ff]"Button1"[/color] EventName=[color=#0000ff]"Click"[/color] />[/COLOR]
[color=#000080]</Triggers>[/color]
كود :
[color=#000080]<%@ Page Language=[COLOR=#0000ff]"C#"[/color] AutoEventWireup=[color=#0000ff]"true"[/color] CodeFile=[color=#0000ff]"Default6.aspx.cs"[/color] Inherits=[color=#0000ff]"Default6"[/color] %>[/COLOR]
[color=#000080]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/color]
[color=#000080]<html xmlns=[COLOR=#0000ff]"http://www.w3.org/1999/xhtml"[/color]>[/COLOR]
[color=#000080]<head runat=[COLOR=#0000ff]"server"[/color]>[/COLOR]
[color=#000080]<title>[/color]Untitled Page[color=#000080]</title>[/color]
[color=#000080]</head>[/color]
[color=#000080]<body>[/color]
[color=#ff8000]<form id=[COLOR=#0000ff]"form1"[/color] runat=[color=#0000ff]"server"[/color]>[/COLOR]
[color=#000080]<asp:ScriptManager ID=[COLOR=#0000ff]"ScriptManager1"[/color] runat=[color=#0000ff]"server"[/color]>[/COLOR]
[color=#000080]</asp:ScriptManager>[/color]
[color=#000080]<div>[/color]
[color=#800080]<img src=[COLOR=#0000ff]"images/food.jpg"[/color] />[/COLOR]
[color=#000080]<asp:UpdatePanel runat=[COLOR=#0000ff]"server"[/color]>[/COLOR][color=#000080]<ContentTemplate>[/color]
[color=#000080]<br />[/color]
[color=#000080]<br />[/color]
[color=#000080]<asp:TextBox ID=[COLOR=#0000ff]"TextBox1"[/color] runat=[color=#0000ff]"server"[/color]>[/COLOR][color=#000080]</asp:TextBox>[/color]
[color=#000080]<br />[/color]
[color=#000080]</ContentTemplate>[/color]
[color=#000080]<Triggers>[/color]
[color=#000080]<asp:AsyncPostBackTrigger ControlID=[COLOR=#0000ff]"Button1"[/color] EventName=[color=#0000ff]"Click"[/color] />[/COLOR]
[color=#000080]</Triggers>[/color]
[color=#000080]</asp:UpdatePanel>[/color]
[color=#000080]<asp:Button ID=[COLOR=#0000ff]"Button1"[/color] runat=[color=#0000ff]"server"[/color] onclick=[color=#0000ff]"Button1_Click"[/color]
Text=[color=#0000ff]"ShowTime"[/color] />[/COLOR]
[color=#000080]</div>[/color]
[color=#ff8000]</form>[/color]
[color=#000080]</body>[/color]
[color=#000080]</html>[/color]