JQuery tabcontrol：加载gridview

Question

我有一个 JQuery/CSS 选项卡控件，它目前处理 4 个选项卡，包含网格视图。 当您点击选项卡时，我希望加载 gridview。这减少了页面的加载时间，因为某些 gridview 的存储过程需要一些时间。 网格视图需要加载一次，不必每次打开特定选项卡时都更新。

JQuery:

$(document).ready(function() 
{ 
    //When page loads... 
    $(".tab_content").hide(); //Hide all content 
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab 
    $(".tab_content:first").show(); //Show first tab content 

    //On Click Event 
    $("ul.tabs li").click(function() 
    { 
        $("ul.tabs li").removeClass("active"); //Remove any "active" class 
        $(this).addClass("active"); //Add "active" class to selected tab 
        $(".tab_content").hide(); //Hide all tab content 

        var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content 
        $(activeTab).fadeIn(); //Fade in the active ID content 
        return false; 
    }); 
});

现在我刚开始使用 JQuery，所以我真的不知道如何处理这个...... 有什么想法吗？

Answer 1

我遇到了类似的问题。我所做的是创建一个按钮来加载gridview，并在jquery 选项卡的选择事件中单击这些按钮。像这样的：

$("#tabs").tabs({
        select: function (event, ui) {
            switch (ui.index) {
                case 0:
                    $("#<%= btnOne.ClientID %>").click();
                    break;
                case 1:
                    $("#<%= btnTwo.ClientID %>").click();
                    break;
                case 2:
                    $("#<%= btnThree.ClientID %>").click();
                    break;
            }
        }
 });

Answer 2

如果你想在服务器上做所有事情，你需要一个更新面板，并使用 __doPostBack 强制回发，以便服务器可以处理请求...你也可以使用 $.ajax 来执行此操作嗯……

否则，全部在客户端完成，将数据从 Web 服务流式传输到客户端，然后在客户端上构建表。

HTH。