السلام عليكم ورحمة الله وبركاته
في المشاريع الكبيره والتي تحتوي على صفحات كثيره ومتعدده فغالباً يكون تقسيم الصفحات بنفس الشكل والنظام مثلا نتحدث عن مجلة او برنامج ادارة محتوى مثل مجلة النيوك
نلاحظ ان الصفحة تنقسم لخمسة اقسام
1- منطقة الهيدر (الترويسة العلوية)
2- منطقة الفوتر (الترويسة السفليه)
3- منطقة القوائم اليمين
4- منطقة القوائم اليسار
5- محتوى الصفحه في المنتصف بين الاقسام الاربعه اعلاه
كل الصفحات تكون تتكون من خمس اقسام تتشابه فيها اربع اقسام وهي
1- منطقة الهيدر (الترويسة العلوية)
2- منطقة الفوتر (الترويسة السفليه)
3- منطقة القوائم اليمين
4- منطقة القوائم اليسار
هذه الاقسام الاربعه تكون نفسها في كل الصفحات بدون اي اختلاف بينما تعرض ادوات ومحتوى الصفحة في المنطقة الخامسه وتتغير على حسب الصفحة نفسها
بما ان لدينا اربعة اقسام متشابهه ولنفرض ان عندنا في المشروع مئة صفحة واردت ان تقوم بالتغيير على احد هذه المناطق مثلا القوائم او الهيدر او الفوتر فانت هنا مجبر على التعديل في المئة صفحة كاااامله وهذا امر غير منطقي بينما لدينا طريقة اسهل وعملية اكثر
الطريقة هي باستخدام صفحات ال Web User Control
سيكون لدينا اربع صفحات نستدعيهم في كل صفحات الموقع الاولى للهيدر والثانيه للفوتر والثالثه للقائمة اليمين والرابعه للقائمة اليسار
فاذا اردنا ان تعدل على الهيدر نقوم بالتعديل على صفحة الهيدر فقط وبالتالي تتعدل في كل صفحات الموقع الاخرى
نفرض ان لدينا صفحة في الموقع هي index.aspx
تتكون الخمس اجزاء التي تم ذكرها اعلاه
طريقة العمل :-
نقوم باضافة اربع صفحات Web User Control
ونسميها هكذا مثلا
header.ascx الترويسة العلوية
footer.ascx الترويسة السفلية
rightmenu.ascx القوائم على اليمين
leftmenu.ascx القوائم على اليسار
نستدعي هذه الاربع صفحات في صفحة الاندكس index.aspx
في السورس كود لصفحة الاندكس ومباشرة تحت اول سطر وهو
كود:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" StylesheetTheme="Andalus" Theme="Andalus" %>
نقوم باستدعاء الاربع صفحات Web User Control
وكود الاستدعاء هو
كود:
<%@ Register TagPrefix="NewsTemp" TagName="header" Src="controlpages/header.ascx" %>
<%@ Register TagPrefix="NewsTemp" TagName="footer" Src="controlpages/footer.ascx" %>
<%@ Register TagPrefix="NewsTemp" TagName="rightmenu" Src="controlpages/rightmenu.ascx" %>
<%@ Register TagPrefix="NewsTemp" TagName="leftmenu" Src="controlpages/leftmenu.ascx" %>
لاحظ انني وضعت الاربع صفحات في داخل مجلد خاص بها وهو ControlPages
كما ان كل صفحة لها اسم خاص بها سنسخدمه في استدعاء الصفحة فيما بعد في المكان الذي نريد عرضها به واسمها هو TagName
صفحة الهيدر اسمها header
وصفحة الفوتر اسمها footer
وصفحة القوائم اليمين اسمها rightmenu
وصفحة القوائم اليسار اسمها leftmenu
هذه الاسماء مسنده لل TagName في الكود ويمكن ان تعتبرها مثل الاسماء البرمجية التي نستدعي بها الادوات
الان في داخل الفورم للصفحة الاندكس Form
نقوم باستدعاء هذه الصفحة بالطريقة التي نرغب بها
مثلا صفحة الهيدر تكون في اول الصفحة من الاعلى فمباشرة تحت فتحة ال Form
نستدعيها بهذا الكود
كود:
<NewsTemp:header runat="server" ID="HeaderTemp" />
وصفحة الفوتر تكون في اخر الصفحة نستدعيها قبل اغلاق ال Form بهذا الكود
كود:
<NewsTemp:footer runat="server" ID="FooterTemp" />
الان بين منطقة الهيدر والفوتر نريد عمل منطقة للقوائم اليمين ومنطقة للقواتم اليسار وفي المنتصف محتوى الصفحة
ببساطه نقوم بعمل جدول يتكون من صف واحد وثلاثه اعمدها قسمها مثلا العامود الاول من اليمين عرضه 25% من الصفحة والعامود الثاني وهو عامود المنتصف عرضه 50% من الصفحة والعامود الثالث وهو عامود القوائم اليسار عرضه 25% من الصفحة
هذا هو الجدول
كود:
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="width: 20%; height: 16px;" valign="top">
هنا منطقة القوائم اليمين
</td>
<td align="center" style="width: 60%; height: 16px;" valign="top">
هنا محتوى الصفحة
</td>
<td align="center" style="width: 20%; height: 16px;" valign="top">
هنا منطقة القوائم اليسار
</td>
</tr>
</table>
الان في مكان جملة منطقة القوائم اليمين نستعدي صفحة الكنترول للقوائم اليمين بهذا الكود
كود:
<NewsTemp:rightmenu runat="server" ID="RightMenuTemp" />
ومكان جملة منطقة القوائم اليسار نستدعي صفحة القوائم اليسار بهذا الكود
كود:
<NewsTemp:leftmenu runat="server" ID="LeftMenuTemp" />
ومكان جملة محتوى الصفحة نعرض محتوى الصفحة فيه
الان انتهينا من عمل الصفحة ونفس هذا التصميم يكون لكل صفحات الموقع وهكذا انت تضمن انه لو اردت فيما بعد ان تقوم بالتعديل على الهيدر مثلا فتقوم بتعديل صفحة header.ascx فقط
نتطرق قليلا لصفحات ال Web User Control
هذه الصفحات لا تختلف عن صفحات ال aspx كثيراً فهي لها سورس كود ولها ايضاً صفحة الكود البرمجي الخاص بها ويمكن وضع اي نوع من الادوات تريده وتستخدمه وايضاً كتابة اي كود تريده في صفحة الكود مثل صفحات ال aspx تماماً
فمثلا ممكن ان تقوم بعمل نظام بلوكات او قواااائم يتم اضافة القوائم من لوحة التحكم مثل مجلة النيوك وفي اليمين او اليسار ومن خلال صفحة الكنترول للقوائم اليمين او اليسار تستدعي هذه القوائم وتفرغها في الصفحة فيكون لديك نظااام قوااائم كما هو في برامج إدارة المحتوى والمجلات العالمية مثل مجلة النيوك في ال php او اي مجلة اخرى حتى مجلات ال asp
اسأل الله تعالى ان اكون وفقت في الشرح واي استفسار انا موجود اخواني
في امان الله وحفظه ولاتنسونا من دعائكم ابدا