TabContainer要实现服务器端回传

 

   搞不懂为什么AJAX Control Toolkit 的Tab控件为什么不提供TabPanel切换时可设置回传或回调。我就要需要这个功能：当在TabPanel切换时，实现动态加载TabPanel里的内容。    

      Google了不少网页，看了不少的文章，好几次冲动地想自己把功能做出来，可抱着别人也应该会遇到这个问题的幻想，终于老天不负有心人，给我打到了答案。似乎找不到中文版的解决方案，可英文版竟然找到了。    

答案在这个网址里：http://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=7739    

不想看E文的话，我这里说下：    

    1。在UpdatePanel里加上这个：

<triggers>

       <asp:AsyncPostBackTrigger ControlID="tabContainer" EventName="ActiveTabChanged" /> </triggers>    

 

    2。在aspx网页上加上这个客户端脚本：

    function ActiveTabChanged(sender, e)

    {

         <%= Page.ClientScript.GetPostBackEventReference(TabContainer, String.Empty) %>

    }

或

    function ActiveTabChanged(sender, e)

   {

      __doPostBack('<%= TabContainer.ClientID %>', sender.get_activeTab().get_headerText());

   }   

   

    3。在Tab控件加上这个属性： OnClientActiveTabChanged="ActiveTabChanged"    

   

    4。在Page_Load事件里加： ScriptManager1.RegisterAsyncPostBackControl(TabContainer); 注意：将以上的“TabContainer”替换为你自定的tab控件ID

TabContainer要实现服务器端回传,出来在后台实现 OnActiveTabChanged 事件外, 还需要在前台实现 OnClientActiveTabChanged 事件，这是关键。

 

 

<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true">     

  <contenttemplate>  

            <ajaxToolkit:TabContainer runat="server" ID="Tabs" Height="480px" Width="100%"             

            OnClientActiveTabChanged="activeTabChanged"            

            OnActiveTabChanged="Tabs_ActiveTabChanged"> 

 

            <ajaxToolkit:TabPanel runat="Server" ID="Panel1" HeaderText="我的消息">                 <ContentTemplate>                

                 ***                 

               </ContentTemplate>             

            </ajaxToolkit:TabPanel>           

      

           <ajaxToolkit:TabPanel runat="Server" ID="Panel2" HeaderText="已发消息"> 

                <ContentTemplate>                 

                ***                

              </ContentTemplate>             

        </ajaxToolkit:TabPanel>         

    </ajaxToolkit:TabContainer>     

</contenttemplate>     

  <triggers>         

<asp:AsyncPostBackTrigger ControlID="Tabs" EventName="ActiveTabChanged" />     

 </triggers>

</asp:UpdatePanel>

<script language="javascript" type="text/jscript">

function activeTabChanged(sender, e) 

 {     

      __doPostBack('<%= Tabs.ClientID %>', sender.get_activeTabIndex()); 

  }  

</script>

 

 

后台.cs代码:

protected void Tabs_ActiveTabChanged(object sender, EventArgs e) {    

switch (Tabs.ActiveTabIndex)   

  {       

 case 0: BindGrid();            

break;        

case 1: BindGrid2();            

break;        

case 2:  Message.Text = "";           

 break;       

default:  break;    

} }