صفحه بندی اطلاعات با کنترل GridView
يکی ديگر از قابليت های جالب و پرکابرد کنترل GridView ، امکان صفحه بندی نمايش رکوردهای
اطلاعاتی در جدول آن است . از اين قابليت معمولا در زمانیاستفاده می شود ، که حجم رکوردها
زياد باشد . برای روشن شدن مطلب يک مثال می زنم . فرض کنيد که شما يک کنترل GridView
داريد که می خواهد اطلاعات حدود 40 نفر از دانشجویان را از جدول Students پايگاه داده
دانشگاه نمايش دهد . در اين حالت 2 راه وجود دارد . اول اينکه کل 40 رکورد را در به
يکباره در جدول کنترل نمايش دهيم و دوم اينکه رکورها را به 4 دسته 10 رکوردی تقسيم
کرده ، که هر دسته در يک صفحه در جدول کنترل نمايش داده می شود . روش دوم به دليل اينکه
در هر لحظه فقط يکی از صفحات در جدول کنترل نمايش داده می شود ، باعث کاهش حجم اطلاعات
دريافتی شده و جدول نيز کوچک تر می شود .
در اين حالت ، رکوردهایی که در يک جدول نمايش داده داده خواهد شد ، به چندين دسته مساوی
تقسيم می شود [ که در هر صفحه يک دسته رکورد را نمايش می دهد . در واقع صفحات در درون
جدول کنترل GridView تعويض می شوند و اين کنترل در هر لحظه يک صفحه از اطلاعات را نمايش
می دهد . در پايين جدول دکمه های پيمايش در صفحات قرار می گيرد ، که با کليک بر روی
آنها می توانيد به صفحه قبل و يا بعد رفته و یا با انتخاب شماره صفحه مورد نظر ، مستقيما
به آن برويد .
با کليکبر روی دکمه های صفحه پيما ، کنترل صفحه را در اصطلاح Postback کرده و جدول را
Refresh می کند . با Refresh شدن صفحه ، جدول رکوردهای مربوط به صفحه انتخاب شده را
، نمايش خواهد داد .
فعال سازی قابليت صفحه بندی در کنترل GridView :
به طور کلی 2 روش برای اين کار وجود دارد :
- استفاده از محيط کد نويسی : در اين حالت بايد مقدار خاصيت AllowPaging
را در درون تگ کنترل ، بر روی مقدار True تنظيم کنيد .
به مثال زير دقت کنيد . مثال : در مثال زير از طريق محيط کدنويسی
خاصيت صفحه بندی را در کنترل GridView1 فعال کرده ايم .
< asp:GridView ID="Gridview1" runat="server"
AllowPaging = "True" >
< /asp:GridView >
|
- استفاده از محيط طراحی ( Design ) نرم افزار Visual Studio :
در اين حالت ابتدا کنترل GridView و کنترل سرور داده اي که می خواهيد کنترل GridView
به آن متصل شود را بر روی صفحه قرار داده و عمليات اتصال آنها به پايگاه داده را انجام
دهيد . سپس کنترل GridView را از روی صفحه انتخاب کرده و بر روی آن کليک سمت راست کنيد
. از منوی باز شده گزينه Show Smart Tag را انتخاب کرده و از منوی جديد باز شده ، گزينه
Enable Paging را تيک بزنيد . در اين حالت کنترل به صورت اتوماتيک کد متنی لازم که
در مورد يک گفتم را به تگ کنترل اضافه می کند .
تعيين اندازه صفحات در کنترل GridView :
می توان در هنگام فعال سازی قابليت صفحه بندی در کنترل GridView ، اندازه صفحات يا
به عبارت ديگر تعداد رکوردهایی که کنترل در هر صفحه نمايش می دهد را به دلخواه تعيين
کرد . برای اين منظور بايد مقدار خاصيت PageSize کنترل را با يک عدد مقدار دهی کرد
، که آن عدد تعيين کننده اندازه صفحات خواهد بود . به مثال زير دقت کنيد .
مثال : در مثال زير يک کنترل GridView را به يک کنترل AccessDataSource
متصل کرده و قابليت صفحه بندی را در آن فعال کرده ايم . همچنين اندازه صفحات آن را
توسط خاصيت PageSize برابر با 4 قرار داده ايم .
< asp:AccessDataSource ID="AccessData1" runat="server"
DataFile="~/App_Data/UniverCity.mdb" SelectCommand = " Select * From
Cities " >
</asp:AccessDataSource>
< asp:GridView ID="Gridview1" runat="server"
DataSourceID="AccessData1" AllowPaging="True" GridLines="Both"
PageSize = "4" >
< /asp:GridView >
|
| ID | Country | City |
| 1 | Iran | Tehran |
| 2 | Germany | Berlin |
| 3 | Japan | Tokyo |
| 4 | S Korea | Seoul |
|
|
تنظيم خواص صفحه بندی و ظاهر دکمه های پيمايش صفحه در کنترل GridView :
شما می توانيد نحوه صفحه بندی و ظاهر دکمه های پيمايش صفحات را در کنترل GridView به
دلخواه خود تغيير دهيد . مثلا می توانيد تعيين کنيد که در هر صفحه چند رکورد نمايش
داده شوند و يا حالت دکمه های پيمايش صفحات چگونه باشد . همچنين می توانيد متن يا نوشته
را جايگزين کنترل های پيمايش صفحه کنيد . مجموعه خواص مرتبط با اين اعمال ، زير مجموعه
خاصيت PagerSetting کنترل GridView هستند . در ادامه به معرفی حالت های مختلف آ ن می
پردازيم :
1 ) حالت های صفحه بندی ( Paging Modes ) :
همانطور که ديديد کنترل GridView به صورت پيش فرض دکمه های پيمايش صفحه را در قسمت
پايينی خود نمايش می دهد ، که از آن می توانيد برای رفتن به صفحه های ماقبل و مابعد
صفحه جاری و يا صفحه های ابتدا و انتهای کنترل استفاده کرد .
به وسيله خاصيت PagerSetting.Mode کنترل GridView می توانيد حالت کلی دکمه های پيمايشی
را تعيين کنيد . شکل کلی استفاده از اين خاصيت به صورت زير است :
نام کنترل GridView.PagerSetting-Mode = " مقدار حالت مورد نظر "
مثال : GridView1.PagerSetting-Mode = " Numeric "
|
انواع حالت های ممکن برای اين خاصيت عبارتند از :
- NextPrevious : در اين حالت فقط دو دکمه Next و Previous برای
رفتن به صفحه مابعد و ماقبل صفحه جاری در نوار پيمايش کنترل نمايش داده می شود . برای
درک بهتر به مثال شماره 1 رجوع نماييد .
مثال شماره
1 : استفاده از حالت NextPrevious
- NextPreviousFirstLast : در اين حالت 4 دکمه زير به ترتيب در
نوار پيمايش کنترل نشان داده می شوند . برای درک بهتر به مثال شماره 2 رجوع نماييد
.:
- First : برای رفتن به اولين صفحه رکوردهای کنترل .
- Previous : برای رفتن به صفحه ماقبل صفحه جاری .
- Next : برای رفتن به صفحه مابعد صفحه جاری .
- Last : برای رفتن به آخرين صفحه رکوردهای کنترل .
مثال شماره 2 : استفاده از
حالت NextPreviousFirstLast
- Numeric : در اين حالت به جای استفاده از دکمه های فلش دار
، مستقيما شماره صفحات نمايش داده می شوند . معمولا کنترل تا جايي که فضا دارد ، شماره
صفحات را نمايش داده و چنانچه شماره صفحاتی به دليل کمبود جا نمايش داده نشود ، به
جای آن ... قرار می گيرد . برای درک بهتر به مثال شماره 3 رجوع نماييد .
مثال شماره 3 : استفاده از حالت
Numeric
- NumericFirstLast : در اين حالت نيز به جای دکمه های فلش دار
شماره صفحات را در نوار پيمايش قرار می گيرند ، به علاوه اينکه برای صفحه اول کنترل
دکمه ( First ) و برای صفحه آخر کنترل دکمه ( Last ) اضافه می شود . برای درک بهتر
به مثال شماره 4 رجوع نماييد .
مثال شماره 4 : استفاده از
حالت NumericFirstLast
تعيين مکان قرار گيری دکمه های پيمايش صفحه در کنترل GridView :
می توان در کنترل GV ، مکان قرار گيری نوار دکمه های پيمايش صفحه را به دلخواه تعيين
کرد . اين نوار به طور پيش فرض در قسمت پايين کنترل نمايش داده می شود . برای تعيين
اين حالت از خاصيت PagerSetting-Position کنترل استفاده می کنيم . شکل کلی استفاده
از اين خاصيت به شرح زير است :
نام کنترل GridView.PagerSetting-Position = " مقدار مکان مورد نظر "
مثال : GridView1.PagerSetting-Mode = " Top "
|
3 حالت ممکن برای اين خاصيت وجود دارد که عبارتند از :
تعيين متن و يا عکس به جای دکمه های پيمايش صفحات در کنترل GridView :
کنترل GridView اين امکان را به ما می دهد که به جای دکمه های پيمايش صفحات متن و يا
عکس مورد نظر را خود را قرار بدهيم . در اين حالت متن و يا عکس تعيين شده برای هر خاصيت
، به جای آن دکمه در نوار پيمايش صفحات نمايش داده می شود . انواع خواص و حالت مورد
استفاده برای اين منظور در جدول زير آمده است . در انتها نيز مثال هایی برای نمايش
عملی و درک بهتر مطالب قرار داده ايم .
|
نام خاصيت
|
شرح
|
|
GridView.PagerSetting-FirstPageImageUrl
|
اين خاصيت آدرس يک عکس را برای نمايش به جای دکمه First در نوار پيمايش کنترل GridView
می گيرد ، که برای رفتن به اولين صفحه اطلاعات از آن استفاده می شود .
|
|
GridView.PagerSettings-FirstPageText
|
به وسيله اين خاصيت می توان يک متن دلخواه را برای نمايش به جای دکمه First در نوار
پيمايش کنترل GridView تعيين کرد ، که برای رفتن به اولين صفحه کنترل از آن استفاده
می شود .
|
|
GridView.PagerSetting-FirstPageImageUrl
|
اين خاصيت آدرس يک عکس را برای نمايش به جای دکمه Last در نوار پيمايش کنترل GridView
می گيرد ، که برای رفتن به اولين صفحه اطلاعات از آن استفاده می شود .
|
|
GridView.PagerSettings-LastPageText
|
به وسيله اين خاصيت می توان يک متن دلخواه را برای نمايش به جای دکمه Last در نوار
پيمايش کنترل GridView تعيين کرد ، که برای رفتن به آخرين صفحه اطلاعات از آن استفاده
می شود .
|
|
GridView.PagerSetting-NextPageImageUrl
|
اين خاصيت آدرس يک عکس را برای نمايش به جای دکمه Next در نوار پيمايش کنترل GridView
می گيرد ، که برای رفتن به صفحه مابعد صفحه جاری از آن استفاده می شود .
|
|
GridView.PagerSettings-NextPageText
|
به وسيله اين خاصيت می توان يک متن دلخواه را برای نمايش به جای دکمه Next در نوار
پيمايش کنترل GridView تعيين کرد ، که برای رفتن به صفحه مابعد صفحه جاری از آن استفاده
می شود .
|
|
GridView.PagerSettings-PreviousPageImageUrl
|
اين خاصيت آدرس يک عکس را برای نمايش به جای دکمه Previous در نوار پيمايش کنترل GridView
می گيرد ، که برای رفتن به صفحه ماقبل صفحه جاری از آن استفاده می شود .
|
|
GridView.PagerSettings-PreviousPageText
|
به وسيله اين خاصيت می توان يک متن دلخواه را برای نمايش به جای دکمه Previous در نوار
پيمايش کنترل GridView تعيين کرد ، که برای رفتن به صفحه ماقبل صفحه جاری از آن استفاده
می شود .
|
مثال های تعيين عکس و تصوير :
مثال شماره 8 : تعيين متن دلخواه
به جای دکمه های پيمايش صفحات
مثال شماره 9 : تعيين تصواوير
دلخواه به جای دکمه های پيمايش صفحات