AjaxControlToolkit + TabContainer + Lazy Loading

Harkon — Wed, 08 Apr 2009 23:02:30 GMT

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

εδώ και λίγο καιρό προσπαθώ να ασχοληθώ με 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

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

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

και aspx.cs

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void kaneKati(object sender, EventArgs e)
    {
        this.lbl.Visible = true;

        this.lbl.Text = "oeoeeo";
        
    }

        
}

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

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

ευχαριστώ

ASP.NET & AJAX

AjaxControlToolkit + TabContainer + Lazy Loading