关于asp.net Tab选项卡的应用注意

zoukankan html css js c++ java

关于asp.net Tab选项卡的应用注意

<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>未命名頁面</title> </head> <mce:script language="javascript"></mce:script> <body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <cc1:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" Height="520px" Width="100%"> <cc1:TabPanel runat="server" HeaderText="汇报本周工作" ID="TabPanel1" OnClientClick="LoadTabShow"> <HeaderTemplate> 汇报本周工作 </HeaderTemplate> <ContentTemplate> <table align="left" class="style4" align="center"> <tr> <td style="text-align: center" mce_style="text-align: center"> 汇报状态: </td> <td> <asp:Literal ID="LitState" runat="server"></asp:Literal> 时间：<asp:Literal ID="LitTime" runat="server"></asp:Literal> </td> </tr> <tr> <td style="text-align: center" mce_style="text-align: center"> 汇报内容:* </td> <td> <asp:TextBox ID="txtContent" runat="server" Width="600px" TextMode="MultiLine" Height="150px"></asp:TextBox> </td> </tr> <tr> <td style="text-align: center" mce_style="text-align: center"> 下周计划: </td> <td> <asp:TextBox ID="txtNextContent" runat="server" Width="600px" TextMode="MultiLine" Height="150px"></asp:TextBox> </td> </tr> <tr> <td style="text-align: center" mce_style="text-align: center"> 附件: </td> <td> <asp:FileUpload ID="FileUpload1" runat="server" /> <asp:Button ID="btnFileUp" runat="server" Text="提交" /> </td> </tr> <tr> <td colspan="2"> <hr /> </td> </tr> <tr> <td style="text-align: center" mce_style="text-align: center"> 浏览人员: </td> <td> <asp:TextBox ID="txtBrowsePeople" runat="server" Width="600px" Enabled="False"></asp:TextBox> </td> </tr> <tr> <td style="text-align: center" mce_style="text-align: center"> 领导批示: </td> <td> <asp:TextBox ID="txtAuthor" runat="server" Width="600px" Enabled="False" Height="24px"></asp:TextBox> </td> </tr> </table> </ContentTemplate> </cc1:TabPanel> <cc1:TabPanel runat="server" HeaderText="参考本周日程" ID="TabPanel02" Height="500px" OnClientClick="LoadTabHide"> <HeaderTemplate> 参考本周日程 </HeaderTemplate> <ContentTemplate> <asp:Repeater ID="RepWeekRiCheng" runat="server"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" style=" 100%;"> <tr style="height: 20px;"> <td style=" 60%;"> 标题 </td> <td style=" 20%;"> 开始时间 </td> <td style=" 20%;"> 结束时间 </td> </tr> </HeaderTemplate> <ItemTemplate> <tr style="height: 25px;"> <td> <span onclick="window.parent.parent.Div_Show('../schedule/add.aspx?id=<%# Eval("id") %>&v=v',345,653)" style="cursor: pointer; text-decoration: underline;"> <%# Eval("title") %></span> </td> <td> <%# Eval("start_Date")%> </td> <td> <%# Eval("end_date")%> </td> </tr> </ItemTemplate> <FooterTemplate> </table> </FooterTemplate> </asp:Repeater> </ContentTemplate> </cc1:TabPanel> </cc1:TabContainer> </div> </form> </body> </html>

1：用js 改变Tab选显示顺序

       实现方法如下：

        function changeTab(tabIndex) {
            var tabBehavior = $get('<%=TabContainer1.ClientID%>').control;
            tabBehavior.set_activeTabIndex(tabIndex);
        }

     1.1 通过后台方法更改

      public void SetTabIndex()
    {
        if (Request.QueryString["tab"] != null)
        {
            string strIndex = Request.QueryString["tab"].Trim();
            TabContainer1.ActiveTabIndex = int.Parse(strIndex);

        }
    }

2：更改Tab的显示名称

<cc1:TabPanel runat="server" HeaderText="汇报本周工作" ID="TabPanel1" OnClientClick="LoadTabShow">
                    <HeaderTemplate>
                        汇报本周工作
                    </HeaderTemplate>

还有一点，更改Tab选项卡的HeaderText 的值，如果不配置 <HeaderTemplate> 节点，就是不存在的意思，可从后台直接更改。

查看全文

相关阅读:
递归
 数组[]
AngularJs学习总结－了解基本特性（－）
终于落脚了！
总结一下面试中的知识点
 bootstrap学习总结-js组件(四)
spark学习进度3：Scala中变量，常量，数据类型，运算符，表达式，循环，方法，函数的基本使用
 spark学习进度2
spark学习进度1
后台得到jsp提交name属性相同的内容

原文地址：https://www.cnblogs.com/yhongl/p/3937935.html