Customizing Pager – GridView Auto Paging

Customizing Pager – Visual Studio के Properties Window का प्रयोग करते हुए हम बडी ही आसानी से अपने Pager को Customize कर सकते हैं, जबकि हम इस Properties Window का प्रयोग करते हुए जिन भी Properties को Set करते हैं, उनसे सम्बंधित Markups Automatically Generate होते रहते हैं, जिसे हम हमारे Visual Basic के Code Window में देख सकते हैं।

उदाहरण के लिए जब हम हमारे GridView Control के लिए AllowPaging=”True” व PageSize=”5“ Set करते हैं, तो इन Setting के लिए Visual Basic निम्नानुसार Auto-Generated Code Create करता है:

[code]
<asp:GridView
   ID="gridEmployees" runat="server"
   …
   AllowPaging="True"
   PageSize="5"
>
[/code]

हालांकि उपरोक्त चित्र में हम देख सकते हैं कि हम अपने Pager की Styling के लिए किन-किन Properties को Use कर सकते हैं और लगभग सभी Styling Properties Self-Descriptive हैं। फिर भी इन Properties में PagerSettings.Mode Property सबसे महत्वपूर्ण Property है:

Numeric Mode

ये Default Mode होता है और जब ये Mode Set रहता है, तब यदि Underlying Data Source से कुल 100 Records Retrieve हो रहे हों और एक Page पर अधिकतम 10 Records Render हो सकते हों, यानी यदि PageSize=”10“ हो, तो उस स्थिति में Numeric Mode Set होने की स्थिति में 1 से 10 तक कुल 10 Hyperlinks Show होते हैं।

जबकि यदि Records की संख्‍या 100 के स्थान पर 1000 हो, तो दिखाई देने वाले Hyperlinks 1 से 100 तक नहीं होते बल्कि Pager की संख्‍या Render हो सकने की क्षमता से अधिक हों, तो उस स्थिति में PagerSettings.PageButtonCount Property में Set संख्‍या से अधिक Pager Links को Ellipsis Link से Replace कर दिया जाता है। जैसे:

NextPrevious Mode

जब हम इस Mode को Set करते हैं, तब Previous व Next Page पर Jump करने के लिए दो Links होते हैं। इस Option को Select करते समय हम NextPageText व PreviousPageText Properties में उस Text को Specify कर सकते हैं, जिसे हम Link के साथ Render करना चाहते हैं। जबकि Image Links Use करते समय हम इसी काम को NextPageImageUrl व PreviousPageImageUrl Properties को Image के URL के Set कर सकते हैं। जैसे:

[code]
   <PagerSettings
      First PageText="First "
      LastPageText="Last"
      Mode="NextPrevious"
      NextPageText="Next"
      PageButtonCount="7"
      PreviousPageText="Previous"
   />
[/code]

जब हम इस Code को Run करते हैं, तो हमें हमारा Output निम्नानुसार प्राप्त होता है:

जहां Number के स्थान पर हमें “Previous” व “Next” Hyperlinks दिखाई देते हैं।

NumericFirst Last Mode

जब हम इस Mode को Set करते हैं, तब First व Last  Page के लिए Additional  Link होता है। जैसे:

[code]
   <PagerSettings
      First PageText="First "
      LastPageText="Last"
      Mode="NumericFirst Last"
      NextPageText="Next"
      PageButtonCount="7"
      PreviousPageText="Previous"
   />
[/code]

जब हम इस Page को Run करते हैं, तो अब हमें निम्नानुसार Output प्राप्त होता है, जहां अन्तिम Page पर पहुंचने के लिए Specified Hyperlink का Text “Last” होता है, जिसे हमने LastPageText Property में Specify किया है:-

और जब हम Last Page पर पहुंचते हैं, तब निम्नानुसार Output प्राप्त होता है, जहां पहले Page पर पहुंचने के लिए Specified Hyperlink का Text “First ” होता है, जिसे हमने First PageText Property में Specify किया है:

NextPreviousFirst Mode

ये Mode NextPrevious Mode के समान ही होता है, लेकिन पहले व अन्तिम Page के लिए First PageText व LastPageText Properties में Specified Text, Hyperlink की तरह Display होता है। हालांकि यदि हम चाहें तो किसी Image को भी इन Hyperlinks के स्थान पर Use कर सकते हैं और उस स्थिति में हमें First PageImageUrl व LastPageImageUrl Property को Set करना होता है। जैसे:

[code]
<PagerSettings
   First PageText="First "
   LastPageText="Last"
   Mode="NextPreviousFirst Last"
   NextPageText="Next"
   PageButtonCount="7"
   PreviousPageText="Previous"
/>
[/code]

जब हम इस प्रकार के Pager Setting वाले GridView Control को Specify करके Webpage को Run करते हैं, तो सबसे पहले हमें हमारा Resultant Output निम्नानुसार दिखाई देता है:

जबकि Next Hyperlink पर Click  करते ही हमें हमारा Resultant Page निम्नानुसार दिखाई देता है:

और Last  Hyperlink पर Click  करने पर हमें दिखाई देने वाला Output निम्नानुसार होता है:

GridView Control के Sorting व Paging Feature को Enable करने का एक ही सबसे बडा Disadvantage है कि हम जितनी बार भी Records की Sorting या Paging करते हैं, Web Browser को फिर से Postback करना पडता है, जिसकी वजह से पूरा HTML Page फिर से Completely Render होता है और यही सबसे बडा Performance Issue भी होता है।

इसलिए GridView Control हमें EnableSortingAndPagingCallbacks नाम की एक Property Provide करता है। इस Property को यदि हम True Set कर दें, तो GridView Control Paging व Sorting के लिए पूरे Page को Reload नहीं करता बल्कि Different Approach Use करते हुए Asynchronous Request के माध्‍यम से Sorting व Paging का काम करता है, जो कि पूरी तरह से Internally AJAX तकनीक को Use करता है।