النسخة الإنجليزية: http://dflying.dflying.net/1/archive/127_paging_your_list_using_aspnet_atlas_pagenavigator_control.html
في هذه السلسلة، سأقدم بعض عناصر التحكم الأكثر تقدمًا في Atlas Sys.UI.Data، بما في ذلك:
Sys.UI.Data.ListView : عرض بيانات القائمة باستخدام عنصر التحكم ASP.NET Atlas ListView
Sys.UI.Data.ItemView: عرض البيانات الفردية من مجموعة باستخدام عنصر التحكم ASP.NET Atlas ItemView
Sys.UI.Data.DataNavigator: استخدم عنصر التحكم ASP.NET Atlas PageNavigator لتنفيذ التنقل عبر الترحيل من جانب العميل
Sys.UI.Data.SortBehavior: للمتابعة
Sys.UI.Data.XSLTView: للمتابعة هذه هي المقالة الثالثة: استخدم عنصر التحكم ASP.NET Atlas PageNavigator لتنفيذ التنقل عبر الترحيل من جانب العميل ووضع كافة السجلات في صفحة واحدة بالتأكيد ليست فكرة جيدة، خاصة عندما يكون لديك مئات أو آلاف السجلات. يحتاج المستخدمون إلى الاستمرار في سحب شريط التمرير أو حتى استخدام Control+F للعثور على المحتوى الذي يبحثون عنه، مما سيؤدي إلى تجربة مستخدم سيئة للغاية. في هذا الوقت، سيكون عرض البيانات في الترحيل أكثر سهولة في الاستخدام. تحتوي بعض عناصر التحكم الموجودة على جانب خادم ASP.NET على إمكانيات مضمنة للترحيل والتنقل بين الصفحات، مثل DataGrid وGridView. وبالمثل، فإن التحكم في عميل Atlas Sys.UI.Data.DataNavigator يوفر أيضًا وظائف مماثلة، مما سيؤدي إلى تحسين كفاءة التطوير لدينا بشكل كبير.
سيعمل عنصر التحكم DataNavigator مع عنصر التحكم DataView (يرجى الرجوع إلى: مقدمة التحكم ضمن مساحة اسم Atlas Sys.Data - DataView وDataFilter). نحن نعلم أن عنصر التحكم DataView لا يوفر طرقًا متعلقة بالتنقل في الصفحة، لذا يمكننا فقط تعيين خاصية pageIndex الخاصة به مباشرةً لتنفيذ التنقل. على الرغم من أن الأمر ليس صعبًا، إلا أن هذه ليست فكرة جيدة في كثير من الحالات، لأن العديد من المطورين المهملين مثلي غالبًا ما ينسون التحقق من القيمة الحدودية لـpageIndex، مما يسبب مشاكل غير ضرورية. يعد هذا أحد الأسباب وراء توفير Atlas لعنصر التحكم DataNavigator، حيث سيكون عنصر التحكم DataNavigator بمثابة وكيل لعنصر التحكم DataView ويوفر واجهة تنقل سهلة الاستخدام للصفحة.
يحتوي كائن DataNavigator على سمة واحدة فقط:
dataView: مرجع إلى كائن DataView سيقوم DataNavigator بتطبيق عملية التنقل في الصفحة عليه. يجب عليك دائمًا تحديد هذه الخاصية.
بالإضافة إلى ذلك، لاستخدام عنصر تحكم DataNavigator، تحتاج أيضًا إلى توفير بعض أزرار Atlas مع بعض خصائص اسم الأمر المحدد لتشغيل عمليات التنقل في الصفحة المقابلة. يجب تعيين الخاصية الأصلية لهذه الأزرار على عنصر تحكم DataNavigator هذا للتأكد من أن DataNavigator يمكنه التقاط الأوامر الصادرة عن هذه الأزرار.
يمكنك تحديد سمة CommandName الخاصة بالزر الخاص بك كالسلاسل الخمس التالية، ولكل منها معنى مختلف:
الصفحة: قم بتحويل فهرس الصفحة الحالية إلى القيمة المحددة في وسيطة الأمر. باستخدام هذا الأمر يمكننا تغيير فهرس الصفحة بسرعة.
الصفحة التالية: قم بالتبديل إلى الصفحة التالية (إذا كانت الصفحة التالية موجودة).
الصفحة السابقة: قم بالتبديل إلى الصفحة السابقة (في حالة وجود صفحة سابقة).
الصفحة الأولى: التبديل إلى الصفحة الأولى.
الصفحة الأخيرة: التبديل إلى الصفحة الأخيرة.
حسنًا، المقدمة المملة مثل MSDN موجودة هنا، دعنا نتعرف على استخدام DataNavigator من خلال مثال.
نحتاج أولاً إلى الكشف عن خدمة ويب حتى تتمكن صفحة الأطلس من استخدامها. ستقوم خدمة الويب بإرجاع 100 سجل. فيما يلي رمز خدمة الويب هذه، وهو سهل الفهم للغاية ولن يتكرر هنا.
خدمة الويب
باستخدام النظام؛
باستخدام System.Collections؛
باستخدام System.Collections.Generic؛
باستخدام System.ComponentModel؛
باستخدام System.IO؛
باستخدام System.Web؛
باستخدام System.Web.Caching؛
باستخدام System.Web.Services؛
باستخدام System.Web.Services.Protocols؛
باستخدام Microsoft.Web.Services
؛
// للتبسيط، يوضح هذا المثال التخزين والمعالجة
// يمكن أيضًا استخدام كائنات البيانات الموجودة في الذاكرة.
//
[WebService(Namespace = " http://tempuri.org/ ")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
الفئة العامة MyDataService: DataService
{
قائمة ثابتة<إدخال> _data;
كائن ثابت _dataLock = كائن جديد ()؛
قائمة ثابتة خاصة <Entry> Data
{
يحصل
{
إذا (_بيانات == فارغة)
{
قفل (_dataLock)
{
إذا (_بيانات == فارغة)
{
_data = new List<Entry>();
لـ (int i = 0; i < 100; i++)
{
_data.Add(new Entry(i, "Dflying " + i.ToString(), string.Format(" Dflying{0}@dflying.net ", i.ToString())));
}
}
}
}
إرجاع _ البيانات؛
}
}
[DataObjectMethod(DataObjectMethodType.Select)]
الإدخال العام[] SelectRows()
{
return MyDataService.Data.ToArray();
}
}
دخول الطبقة العامة
{
سلسلة خاصة _name؛
سلسلة خاصة _email؛
معرف int الخاص
[DataObjectField(صحيح، صحيح)]
معرف كثافة العمليات العامة
{
الحصول على {عودة _id}
تعيين { _id = القيمة }
}
[DataObjectField(خطأ)]
[DefaultValue("صف جديد")]
اسم السلسلة العامة
{
الحصول على { اسم العودة }
تعيين {_الاسم = القيمة}
}
[DataObjectField(خطأ)]
[القيمة الافتراضية("")]
سلسلة البريد الإلكتروني العامة
{
الحصول على { عودة _البريد الإلكتروني }
تعيين {_البريد الإلكتروني = القيمة}
}
الإدخال العام ()
{
_id = -1;
}
الإدخال العام (معرف كثافة العمليات، اسم السلسلة، وصف السلسلة)
{
_id = معرف;
_الاسم = الاسم؛
_البريد الإلكتروني = الوصف؛
}
}
بعد ذلك، في صفحة ASPX، نحتاج إلى مراعاة الأجزاء الأربعة التالية وتعريفها:
عنصر تحكم ScriptManager ليحتوي على ملفات البرامج النصية ذات الصلة بـ Atlas Framework والضرورية للصفحة. عادةً، هذا هو ما يجب أن تتضمنه كل صفحة من صفحات الأطلس.
عنصر نائب div (المعرف هو dataContents، راجع الكود). سوف يقوم Atlas بوضع ListView المرقّم هنا.
يتم استخدام div (عنصر تحكم DataNavigator) كحاوية ومجموعة من الأزرار (أزرار الأوامر) المضمنة فيه لتنفيذ وظائف التنقل في الصفحة.
قسم مخفي يستخدم لوضع قالب ListView.
فيما يلي رمز الأجزاء الأربعة المذكورة أعلاه فيما يتعلق بقالب عنصر تحكم ListView، يرجى الرجوع إلى مقالتي: استخدام عنصر تحكم ASP.NET Atlas ListView لعرض بيانات القائمة.
<!-- مدير البرنامج النصي -->
<atlas:ScriptManager runat="server" ID="scriptManager" />
<!-- عنصر ListView المقسم إلى صفحات (حاوية) -->
<div id="dataContents">
</div>
<!-- متصفح الصفحة -->
<div id="pageNavigator">
<نوع الإدخال = "زر" id = "btnFirstPage" القيمة = "<< />".
<نوع الإدخال = "زر" id = "btnPrevPage" القيمة = "<؛" />
<span id="lblPageNumber"></span> / <span id="lblPageCount"></span>
<نوع الإدخال = "زر" id = "btnNextPage" القيمة = ">؛ />".
<نوع الإدخال = "زر" id = "btnLastPage" القيمة = ">>" />
</div>
<!-- القوالب -->
<div style = "الرؤية: مخفية؛ العرض: لا شيء">
<معرف الجدول = "myList_layoutTemplate" الحدود = "1" خلية الحشو = "3" نمط = "العرض: 20em؛">
<الرأس>
<تر>
<td><span>لا.</span></td>
<td><span>الاسم</span></td>
<td><span>البريد الإلكتروني</span></td>
</tr>
</الرأس>
<!--كرر القالب -->
<tbody id="myList_itemTemplateParent">
<!-- قالب تكرار العنصر -->
<tr id="myList_itemTemplate">
<td><span id="lblIndex" /></td>
<td><span id="lblName" /></td>
<td><span id="lblEmail" /></td>
</tr>
</tbody>
</الجدول>
<!--نموذج فارغ -->
<div id="myList_emptyTemplate">
لا توجد بيانات
</div>
</div>
أخيرًا، حان الوقت لكتابة تعريف برنامج XML النصي لـ Atlas، والذي يتكون من الأجزاء الخمسة التالية:
الجزء 1: التحكم في عميل Atlas DataSource، المستخدم للحصول على البيانات من خدمة الويب التي حددناها أعلاه.
<dataSource id="dataSource" autoLoad="true" ServiceURL="MyDataService.asmx" />
الجزء 2: عنصر تحكم DataView (يرجى الرجوع إلى: مقدمة إلى عناصر التحكم الموجودة ضمن مساحة اسم Atlas Sys.Data - DataView وDataFilter)، المستخدمة لصفحة 100 قطعة من البيانات التي تم الحصول عليها في الجزء الأول.
<dataView id = "view" pageSize = "12">
<الارتباطات>
<binding dataContext = "dataSource" dataPath = "data" property = "data" />
</الربط>
</dataView>
الجزء 3: عنصر تحكم ListView (يُرجى الرجوع إلى: استخدام عنصر تحكم ASP.NET Atlas ListView لعرض بيانات القائمة)، يُستخدم لعرض البيانات المرقّمة.
<listView id="dataContents" itemTemplateParentElementId="myList_itemTemplateParent" >
<الارتباطات>
<binding dataContext="view" dataPath="filteredData" property="data"/>
</الربط>
<قالب التخطيط>
<template LayoutElement="myList_layoutTemplate"/>
</layoutTemplate>
<قالب العنصر>
<template LayoutElement="myList_itemTemplate">
<معرف التسمية = "lblIndex">
<الارتباطات>
<binding dataPath = "$index" تحويل = "إضافة" خاصية = "نص"/>
</الربط>
</التسمية>
<معرف التسمية = "lblName">
<الارتباطات>
<binding dataPath="Name" property="text"/>
</الربط>
</التسمية>
<معرف التسمية = "lblEmail">
<الارتباطات>
<binding dataPath="Email" property="text"/>
</الربط>
</التسمية>
</قالب>
</itemTemplate>
<فارغة القالب>
<template LayoutElement="myList_emptyTemplate"/>
</emptyTemplate>
</listView>
الجزء 4: أزرار التحكم والأوامر في DataNavigator. لاحظ أن لدينا أربعة أزرار هنا، لكل منها سمة مختلفة لـ CommandName، والتي تتوافق أيضًا مع عملية DataNavigator في DataView. وفي الوقت نفسه، يتم تعيين الخصائص الأصلية لهذه الأزرار إلى كائن DataNavigator هذا.
<dataNavigator id="pageNavigator" dataView="view"/>
<button id="btnFirstPage"parent="pageNavigator" command="FirstPage" />
<button id="btnPrevPage"parent="pageNavigator" command="الصفحة السابقة">
<الارتباطات>
<binding property="enabled" dataPath="hasPreviousPage"/>
</الربط>
</زر>
<زر معرف = "btnNextPage" الأصل = "pageNavigator" الأمر = "الصفحة التالية">
<الارتباطات>
<binding property="enabled" dataPath="hasNextPage"/>
</الربط>
</زر>
<button id="btnLastPage"parent="pageNavigator" command="LastPage" />
الجزء 5: علامتان توضحان العدد الإجمالي للصفحات والرقم التسلسلي للصفحة الحالية على التوالي.
<label id="lblPageNumber">
<الارتباطات>
<binding dataContext = "view" property = "text" dataPath = "pageIndex" تحويل = "Add"/>
</الربط>
</التسمية>
<label id="lblPageCount">
<الارتباطات>
<binding dataContext="view" property="text" dataPath="pageCount"/>
</الربط>
</التسمية>
حسنًا، اختبره في المتصفح:
