Προς το περιεχόμενο

AjaxControlToolkit + TabContainer + Lazy Loading

Harkon

Από τον Harkon
στο Προγραμματισμός

Προτεινόμενες αναρτήσεις

Harkon Experienced

Harkon

Δημοσ.
Δημοσ.

Καλησπέρα σας,

 

εδώ και λίγο καιρό προσπαθώ να ασχοληθώ με web programming μιας και το πεδίο δράσης μου ήταν έως τώρα οι desktop applications.

 

Θέλω λοιπόν να χρησιμοποιήσω ένα tabContainer και σε κάθε tab να φορτώνω κάποια data από την database.

Θα προτιμούσα όμως να μην φορτώνονται όλα εξ αρχής αλλά μόνο όταν κάνει κάποιος κλικ σε ένα άλλο - πλην του αρχικού - tab να "φεύγει" το request και να φορτώνει τα δεδομένα που πρέπει.

Η τεχνική αυτή από ότι διάβασα καλείται 'lazy loading'. Επίσης θα ήθελα να χρησιμοποιήσω και AJAX προκειμένου να μην γίνεται όλη η σελίδα Post back αλλά μόνο το συγκεκριμένο κομμάτι της.

Σε μια προσπάθεια να βρω άκρη σε αυτό έπεσα πάνω στον παρακάτω σύνδεσμο http://mattberseth.com/blog/2007/07/how_to_lazyload_tabpanels_with.html

Επειδή με αυτό που ήθελα να κάνω τελικά δεν τα κατάφερα είπα να κάνω κάτι πιο απλό.

 

Έτσι έγραψα το παρακάτω:

 

.aspx

 

>
[color=Black][font=Courier New][color=Blue][font=Courier New]<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>[/font][/color]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
[color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]html[/font][/color] [color=Red][font=Courier New]xmlns[/font][/color][color=Blue][font=Courier New]="http://www.w3.org/1999/xhtml"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
[color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]head[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
   [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]title[/font][/color][color=Blue][font=Courier New]>[/font][/color]Untitled Page[color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]title[/font][/color][color=Blue][font=Courier New]>[/font][/color]
   [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]script[/font][/color] [color=Red][font=Courier New]type[/font][/color][color=Blue][font=Courier New]="text/javascript"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
   function allakseTab(sender,args){
     
if (sender.get_activeTabIndex() == 1) {
        __doPostBack('btn1', '');
                       }
       
   }
   [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]script[/font][/color][color=Blue][font=Courier New]>[/font][/color]
[color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]head[/font][/color][color=Blue][font=Courier New]>[/font][/color]
[color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]body[/font][/color][color=Blue][font=Courier New]>[/font][/color]
   [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]form[/font][/color] [color=Red][font=Courier New]id[/font][/color][color=Blue][font=Courier New]="form1"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
       [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]asp:ScriptManager[/font][/color] [color=Red][font=Courier New]ID[/font][/color][color=Blue][font=Courier New]="ScriptManager1"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color] [color=Blue][font=Courier New]/>[/font][/color]
       [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]br[/font][/color] [color=Blue][font=Courier New]/>[/font][/color]
       [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]div[/font][/color][color=Blue][font=Courier New]>[/font][/color]
       [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]input[/font][/color] [color=Red][font=Courier New]id[/font][/color][color=Blue][font=Courier New]="btn1"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color] [color=Red][font=Courier New]type[/font][/color][color=Blue][font=Courier New]="button"[/font][/color] [color=Red][font=Courier New]style[/font][/color][color=Blue][font=Courier New]="display:none"[/font][/color] [color=Red][font=Courier New]onserverclick[/font][/color][color=Blue][font=Courier New]="kaneKati"[/font][/color] [color=Blue][font=Courier New]/>[/font][/color]
           [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]cc1:TabContainer[/font][/color] [color=Red][font=Courier New]ID[/font][/color][color=Blue][font=Courier New]="TabContainer1"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color] [color=Red][font=Courier New]ActiveTabIndex[/font][/color][color=Blue][font=Courier New]="0"[/font][/color] [color=Red][font=Courier New]Height[/font][/color][color=Blue][font=Courier New]="280px"[/font][/color]  [color=Red][font=Courier New]OnClientActiveTabChanged[/font][/color][color=Blue][font=Courier New]="allakseTab()"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
               [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]cc1:TabPanel[/font][/color] [color=Red][font=Courier New]ID[/font][/color][color=Blue][font=Courier New]="TabPanel1"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color] [color=Red][font=Courier New]HeaderText[/font][/color][color=Blue][font=Courier New]="TabPanel1"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                   [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]ContentTemplate[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                       keimeno 1
                   [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]ContentTemplate[/font][/color][color=Blue][font=Courier New]>[/font][/color]                    
               [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]cc1:TabPanel[/font][/color][color=Blue][font=Courier New]>[/font][/color]
               [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]cc1:TabPanel[/font][/color] [color=Red][font=Courier New]ID[/font][/color][color=Blue][font=Courier New]="TabPanel2"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color] [color=Red][font=Courier New]HeaderText[/font][/color][color=Blue][font=Courier New]="TabPanel2"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                   [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]ContentTemplate[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                       [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]asp:UpdatePanel[/font][/color] [color=Red][font=Courier New]ID[/font][/color][color=Blue][font=Courier New]="UpdatePanel1"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color] [color=Red][font=Courier New]UpdateMode[/font][/color][color=Blue][font=Courier New]="Conditional"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                           [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]Triggers[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                               [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]asp:AsyncPostBackTrigger[/font][/color] [color=Red][font=Courier New]ControlID[/font][/color][color=Blue][font=Courier New]="btn1"[/font][/color] [color=Blue][font=Courier New]/>[/font][/color]
                           [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]Triggers[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                           [color=Blue][font=Courier New]<[/font][/color][color=Maroon][font=Courier New]ContentTemplate[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                               [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]asp:label[/font][/color] [color=Red][font=Courier New]id[/font][/color][color=Blue][font=Courier New]="lbl"[/font][/color] [color=Red][font=Courier New]runat[/font][/color][color=Blue][font=Courier New]="server"[/font][/color] [color=Red][font=Courier New]visible[/font][/color][color=Blue][font=Courier New]="false"[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                           [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]ContentTemplate[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                       [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]asp:UpdatePanel[/font][/color][color=Blue][font=Courier New]>[/font][/color]
                   [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]ContentTemplate[/font][/color][color=Blue][font=Courier New]>[/font][/color]
               [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]cc1:TabPanel[/font][/color][color=Blue][font=Courier New]>[/font][/color]
           [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]div[/font][/color][color=Blue][font=Courier New]>[/font][/color]
   [color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]form[/font][/color][color=Blue][font=Courier New]>[/font][/color]
[color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]body[/font][/color][color=Blue][font=Courier New]>[/font][/color]
[color=Blue][font=Courier New]</[/font][/color][color=Maroon][font=Courier New]html[/font][/color][color=Blue][font=Courier New]>[/font][/color][/font][/color]

 

 

και aspx.cs

 

>
[color=Black][font=Courier New][color=Blue][font=Courier New]using[/font][/color] System;
[color=Blue][font=Courier New]using[/font][/color] System.Data;
[color=Blue][font=Courier New]using[/font][/color] System.Configuration;
[color=Blue][font=Courier New]using[/font][/color] System.Web;
[color=Blue][font=Courier New]using[/font][/color] System.Web.Security;
[color=Blue][font=Courier New]using[/font][/color] System.Web.UI;
[color=Blue][font=Courier New]using[/font][/color] System.Web.UI.WebControls;
[color=Blue][font=Courier New]using[/font][/color] System.Web.UI.WebControls.WebParts;
[color=Blue][font=Courier New]using[/font][/color] System.Web.UI.HtmlControls;

[color=Blue][font=Courier New]public[/font][/color] partial [color=Blue][font=Courier New]class[/font][/color] _Default : System.Web.UI.Page 
{
   [color=Blue][font=Courier New]protected[/font][/color] [color=Blue][font=Courier New]void[/font][/color] Page_Load([color=Blue][font=Courier New]object[/font][/color] sender, EventArgs e)
   {

   }

   [color=Blue][font=Courier New]protected[/font][/color] [color=Blue][font=Courier New]void[/font][/color] kaneKati([color=Blue][font=Courier New]object[/font][/color] sender, EventArgs e)
   {
       [color=Blue][font=Courier New]this[/font][/color].lbl.Visible [color=Red][font=Courier New]=[/font][/color] [color=Blue][font=Courier New]true[/font][/color];

       [color=Blue][font=Courier New]this[/font][/color].lbl.Text [color=Red][font=Courier New]=[/font][/color] [font=Courier New]"oeoeeo"[/font];
       
   }


[/font][/color]

 

ακόμα και αυτό το απλό όμως δεν μου δούλεψε.

κάτι χάνω και νομίζω πως οφείλεται στις ελειπείς γνώσεις μου στον web progr.

 

βλέπετε κάτι το μεμπτό ή έχετε να προτείνετε κάτι διαφορετικό;

 

ευχαριστώ

Αρχειοθετημένο

Αυτό το θέμα έχει αρχειοθετηθεί και είναι κλειστό για περαιτέρω απαντήσεις.

Προς την λίστα θεμάτων
  • Δημιουργία νέου...