تقييم الموضوع :
  • 0 أصوات - بمعدل 0
  • 1
  • 2
  • 3
  • 4
  • 5
تعلم كيف تستخدم أكثر من Update Panel فى الصفحة الواحدة
#1
كاتب الموضوع : Ahmed Moosa



بسم الله الرحمن الرحيم

والحمد لله رب العالمين

إستخدام أكثر من Update Panel فى الصفحة الواحدة

الشكل النهائى الذى سنصل إليه

"تعثر تحميل الصورة على الموقع "


"للمعرفة "
- يتم تنفيذ هذا الدرس بإستخدام تقنية Ajax . فى Visual Web Developer أو Visual Studio .

الأهدف :-
- معرفة كيفية إستخدام Update Panel .
- معرفة كيفية تحديث Update Panel حسب الحدث .


فكرة العمل :-
- تحديث الوقت حسب الحدث الذى نطلبه . وهو كما فى الصورة عند الضغط على أى Button .


الخطوات :-

1- قم بفتح قائمة File وأختر منها New وإختر منها Web Site .
2- تظهر لك نافذة إختر منها ASP.Net Ajax Enabled Web Site .
3- قم بإدراج Update Panel مرتين .
4-قم بإدراج Label فى كل Update Panel .
5- قم بإدراج Button فى كل Update Panel .
6 –إذهب إلى كود التصميم المسمى (Source) وأضبط فيه الخصائص التالية :-

كود :
[color=#000000][COLOR=#0000bb] [/color][color=#007700]<[/color][color=#0000bb]div style[/color][color=#007700]=[/color][color=#dd0000]"text-align:center ; border-style:dashed "[/color][COLOR=#007700]>
     <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]UpdatePanel ID[/color][color=#007700]=[/color][color=#dd0000]"UpdatePanel1" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server" [/color][color=#0000bb]UpdateMode[/color][color=#007700]=[/color][color=#dd0000]"Conditional" [/color][COLOR=#007700]>
          <[/COLOR][color=#0000bb]ContentTemplate[/color][COLOR=#007700]>
             <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]Label ID[/color][color=#007700]=[/color][color=#dd0000]"Label1" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server" [/color][COLOR=#007700]/>                        
          </[/COLOR][color=#0000bb]ContentTemplate[/color][COLOR=#007700]>
          <[/COLOR][color=#0000bb]Triggers[/color][COLOR=#007700]>
             <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]AsyncPostBackTrigger ControlID[/color][color=#007700]=[/color][color=#dd0000]"Button1" [/color][color=#0000bb]EventName[/color][color=#007700]=[/color][color=#dd0000]"Click" [/color][COLOR=#007700]/>
          </[/COLOR][color=#0000bb]Triggers[/color][COLOR=#007700]>
       </[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]UpdatePanel[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]Button ID[/color][color=#007700]=[/color][color=#dd0000]"Button1" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server" [/color][color=#0000bb]Text[/color][color=#007700]=[/color][color=#dd0000]"Update First" [/color][COLOR=#007700]/>
    </[/COLOR][color=#0000bb]div[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]br [/color][COLOR=#007700]/>          
    <[/COLOR][color=#0000bb]div style[/color][color=#007700]=[/color][color=#dd0000]"text-align:center ; border-style:dashed "[/color][COLOR=#007700]>
       <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]UpdatePanel ID[/color][color=#007700]=[/color][color=#dd0000]"UpdatePanel2" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server" [/color][color=#0000bb]UpdateMode[/color][color=#007700]=[/color][color=#dd0000]"Conditional"  [/color][COLOR=#007700]>
           <[/COLOR][color=#0000bb]ContentTemplate[/color][COLOR=#007700]>
               <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]Label ID[/color][color=#007700]=[/color][color=#dd0000]"Label2" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server" [/color][COLOR=#007700]/>
               <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]Button ID[/color][color=#007700]=[/color][color=#dd0000]"Button2" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server" [/color][color=#0000bb]Text[/color][color=#007700]=[/color][color=#dd0000]"Update Second" [/color][COLOR=#007700]/>
           </[/COLOR][color=#0000bb]ContentTemplate[/color][COLOR=#007700]>
           <[/COLOR][color=#0000bb]Triggers[/color][COLOR=#007700]>
              <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]AsyncPostBackTrigger ControlID[/color][color=#007700]=[/color][color=#dd0000]"Button2" [/color][color=#0000bb]EventName[/color][color=#007700]=[/color][color=#dd0000]"Click" [/color][COLOR=#007700]/>
           </[/COLOR][color=#0000bb]Triggers[/color][COLOR=#007700]>
       </[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]UpdatePanel[/color][COLOR=#007700]>                
</[/COLOR][color=#0000bb]div[/color][COLOR=#007700]>  
[/COLOR][color=#0000bb][/color][/COLOR]

تحليل بعض الكود

-UpdateMode :- وتحدد أن التحديث يكون بالشرط الذى نحدده فى الـ Triggers .
-Triggers :- وفيها نعرف الأداة التى سنستخدمها فى عملية التحديث وهنا عرفنا أنه هو الـ Button وفيها أيضاً قمنا بتعريف الحدث الذى سنستخدمه وهو هنا Click .
-لا يشترط أن تكون المسئولة داخل الأداة Update Panel أو خارجها .
-هناك الجزء المعرف بـ Style داخل الأمر div فلا تبالى به وضع تنسيقاً من إبداعك .

أماعن كود C# أو VB فلن نستخدمه إلا لعرض الوقت فى Label1 و Label 2 .

C#

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]protected [/color][color=#0000bb]void Page_Load[/color][color=#007700]([/color][color=#0000bb]object sender[/color][color=#007700], [/color][color=#0000bb]EventArgs e[/color][COLOR=#007700])
    {
        [/COLOR][color=#0000bb]Label1[/color][color=#007700].[/color][color=#0000bb]Text [/color][color=#007700]= [/color][color=#0000bb]DateTime[/color][color=#007700].[/color][color=#0000bb]Now[/color][color=#007700].[/color][color=#0000bb]ToLongTimeString [/color][COLOR=#007700]();
        [/COLOR][color=#0000bb]Label2[/color][color=#007700].[/color][color=#0000bb]Text [/color][color=#007700]= [/color][color=#0000bb]DateTime[/color][color=#007700].[/color][color=#0000bb]Now[/color][color=#007700].[/color][color=#0000bb]ToLongTimeString [/color][COLOR=#007700]();
    }  
[/COLOR][color=#0000bb][/color][/COLOR]

Vb

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]Protected [/color][color=#0000bb]Sub Page_Load[/color][color=#007700]([/color][color=#0000bb]ByVal sender [/color][color=#007700]As [/color][color=#0000bb]Object[/color][color=#007700], [/color][color=#0000bb]ByVal e [/color][color=#007700]As [/color][color=#0000bb]System[/color][color=#007700].[/color][color=#0000bb]EventArgs[/color][color=#007700]) [/color][color=#0000bb]Handles Me[/color][color=#007700].[/color][COLOR=#0000bb]Load
        Label1[/COLOR][color=#007700].[/color][color=#0000bb]Text [/color][color=#007700]= [/color][color=#0000bb]DateTime[/color][color=#007700].[/color][color=#0000bb]Now[/color][color=#007700].[/color][color=#0000bb]ToLongTimeString[/color][COLOR=#007700]()
        [/COLOR][color=#0000bb]Label2[/color][color=#007700].[/color][color=#0000bb]Text [/color][color=#007700]= [/color][color=#0000bb]DateTime[/color][color=#007700].[/color][color=#0000bb]Now[/color][color=#007700].[/color][color=#0000bb]ToLongTimeString[/color][COLOR=#007700]()
[/COLOR][COLOR=#0000bb]End Sub  
[/COLOR][/COLOR]

أبدع
ما رأيك ان تستخدم هذا الدرس فى عمل لوحة إعلانات تحدث نفسها تلقائياً .
أو أن تستخدمه فى عرض شريط أخبار كل خبر على حده يظهر تلقائياً .
أو أن تستخدمه فى كتابة التعليقات لموضوعاتك فى موقعك الخاص.
أو أن تستخدمه فى عرض أخر الموضوعات فى مدونتك أو موقعك .
أو أن تستخدمه فى .........................

إلى هنا نصل نهاية الدرس و الحمد لله رب العالمين
}}}}
تم الشكر بواسطة:


المواضيع المحتمل أن تكون متشابهة .
الموضوع : الكاتب الردود : المشاهدات : آخر رد
  [درس فيديو] تعلم تقنية SignalR الموجوده في Asp.Net myalsailamy 1 205 01-10-16, 03:57 AM
آخر رد: ممدوح
  سلسلة تعلم (Asp.Net MVC ) بالعربي محمد الساعدي 15 9,501 09-08-16, 01:34 PM
آخر رد: Queen
  تعلم كيفية إرسال إيميل محمد الحاج خلف 0 819 14-03-13, 05:52 PM
آخر رد: محمد الحاج خلف
  تعلم كيف تتعامل مع Web.config فى سلسلة دروس RaggiTech 3 1,362 15-10-12, 11:14 AM
آخر رد: RaggiTech
  تعلم كيف تستخدم Application Objects RaggiTech 0 569 15-10-12, 11:10 AM
آخر رد: RaggiTech
  تعلم كيف تستخدم MVP Pattern فى ASP.Net RaggiTech 0 798 15-10-12, 11:09 AM
آخر رد: RaggiTech
  تعلم كيف تستخدم WebFormsMVP Framework فى ASP.Net RaggiTech 0 451 15-10-12, 11:05 AM
آخر رد: RaggiTech
  تعلم كيف تضيف أدوات Ajax فى 2005 و 2008 RaggiTech 0 536 15-10-12, 10:58 AM
آخر رد: RaggiTech
  تعلم كيف تضيف مكونات Nuget إلى مشروعك RaggiTech 0 471 15-10-12, 10:57 AM
آخر رد: RaggiTech
  تعلم كيف تغير Master Page فى وقت التشغيل RaggiTech 0 501 15-10-12, 10:55 AM
آخر رد: RaggiTech

التنقل السريع :


يقوم بقرائة الموضوع: بالاضافة الى ( 1 ) ضيف كريم