[ASP.NET] التعامل مع الـ Web User Control  

السلام عليكم ورحمة الله وبركاته..

في المشاريع الكبيرة والتي تحتوي على صفحات كثيرة ومتعددة فغالباً يكون تقسيم الصفحات بنفس الشكل والنظام مثلاًً

نتحدث عن مجلة أو برنامج إدارة محتوى مثل مجلة النيوك

نلاحظ ان الصفحة تنقسم لخمسة أقسام

1. 1- منطقة الهيدر (الترويسة العلوية)
2. 2- منطقة الفوتر (الترويسة السفلية)
3. 3- منطقة القوائم اليمين
4. 4- منطقة القوائم اليسار
5. 5- محتوى الصفحه في المنتصف بين الأقسام الأربعة أعلاه

كل الصفحات تتكون من خمس أقسام تتشابه فيها أربعة أقسام وهي:

1. 1- منطقة الهيدر (الترويسة العلوية)
2. 2- منطقة الفوتر (الترويسة السفليه)
3. 3- منطقة القوائم اليمين
4. 4- منطقة القوائم اليسار

هذه الأقسام الأربعة تكون نفسها في كل الصفحات بدون أي اختلاف، بينما تعرض أدوات ومحتوى الصفحة في المنطقة

الخامسة وتتغير على حسب الصفحة نفسها

بما أن لدينا أربعة أقسام متشابهة ولنفرض أن لدينا في المشروع مئة صفحة، وأردت أن تقوم بالتغيير على أحد هذه

المناطق، مثلاًً القوائم أو الهيدر أو الفوتر، فأنت هنا مجبر على التعديل في المئة صفحة كلها، وهذا أمر غير منطقي بينما

لدينا طريقة اسهل وعملية أكثر.

الطريقة هي باستخدام صفحات الـ Web User Control

سيكون لدينا أربع صفحات نستدعيهم في كل صفحات الموقع، الأولى للهيدر والثانية للفوتر والثالثة للقائمة اليمنى، والرابعه

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

نفرض أن لدينا صفحة في الموقع هي index.aspx

تتكون من الخمسة أجزاء التي تم ذكرها أعلاه.

طريقة العمل

نقوم بإضافة أربع صفحات Web User Control

ونسميها هكذا مثلاًً:

• header.ascx الترويسة العلوية
• footer.ascx الترويسة السفلية
• rightmenu.ascx القوائم على اليمين
• leftmenu.ascx القوائم على اليسار

نستدعي هذه الأربع صفحات في صفحة الإندكس index.aspx

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

نقوم باستدعاء الأربع صفحات Web User Control

وكود الاستدعاء هو:

لاحظ أنني وضعت الأربع صفحات في داخل مجلد خاص بها وهو ControlPages

كما أن كل صفحة لها اسم خاص بها سنسخدمه في استدعاء الصفحة فيما بعد في المكان الذي نريد عرضها به واسمها هو

TagName

صفحة الهيدر اسمها header

وصفحة الفوتر اسمها footer

وصفحة القوائم اليمين اسمها rightmenu

وصفحة القوائم اليسار اسمها leftmenu

هذه الأسماء مسنده لل TagName في الكود ويمكن أن نعتبرها مثل الأسماء البرمجية التي نستدعي بها الأدوات.

الآن في داخل الفورم لصفحة الإندكس Form

نقوم باستدعاء هذه الصفحة بالطريقة التي نرغب بها..
مثلاًً صفحة الهيدر تكون في رأس الصفحة ومباشرة تحته فتحة الـ Form

نستدعيها بهذا الكود:

وصفحة الفوتر تكون في آخر الصفحة نستدعيها قبل اغلاق ال Form بهذا الكود:

الآن بين منطقة الهيدر والفوتر نريد عمل منطقة للقوائم اليمنى ومنطقة للقوائم اليسرى، وفي المنتصف محتوى الصفحة..

ببساطة، ننشئ جدولاً يتكون من صف واحد وثلاثة أعمدة، قم بتقسيمها، مثلاًً العامود الأول من اليمين عرضه 25% من الصفحة والعامود الثاني وهو عامود المنتصف عرضه 50% من الصفحة، والعامود الثالث وهو عامود القوائم اليسرى عرضه 25% من الصفحة.

هذا هو الجدول:

الآن في مكان جملة منطقة القوائم اليمنى نستعدي صفحة الكنترول للقوائم اليمنى بهذا الكود:

ومكان جملة منطقة القوائم اليسرى نستدعي صفحة القوائم اليسرى بهذا الكود:

ومكان جملة محتوى الصفحة نعرض محتوى الصفحة فيه

الآن، انتهينا من عمل الصفحة ونفس هذا التصميم يكون لكل صفحات الموقع وهكذا أنت تضمن أنك لو أردت فيما بعد أن تقوم بالتعديل على الهيدر مثلاًً، فتقوم بتعديل صفحة header.ascx فقط.

نتطرق قليلاً لصفحات الـ Web User Control

هذه الصفحات لا تختلف عن صفحات ال aspx كثيراً فهي لها سورس كود ولها ايضاً صفحة الكود البرمجي الخاص بها ويمكن وضع أي نوع من الأدوات تريده وتستخدمه وايضاً كتابة أي كود تريده في صفحة الكود مثل صفحات الـ aspx تماماً.

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

أسأل الله تعالى أن أكون وفقت في الشرح، وأي استفسار أنا موجود..

في أمان الله وحفظه ولاتنسونا من دعائكم ابداً.