界面:
对tabtrip的简单封装   js的querystring Request.QueryString

用到ajaxtoolkit中的tabcontainer。

情景:由于项目中每种CI都有类似的界面,现将其初步封装到用户控件中。
如上,基本信息是一个页面,硬件信息是另外一个页面。现在是直接将tabcontainer拖到这6个页上,但是将来要增加一个tab,或者减少一个tab,将需要在6个地方修改。
现将其提到用户控件中。

usercontrol中代码:
对tabtrip的简单封装   js的querystring Request.QueryString<cc1:TabContainer ID="TabContainer1" runat="server">
对tabtrip的简单封装   js的querystring Request.QueryString
<cc1:TabPanel ID="TabPanel1" runat="server" HeaderText="TabPanel1" OnClientClick="onTab1Click">
对tabtrip的简单封装   js的querystring Request.QueryString        
<HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString            基本信息
对tabtrip的简单封装   js的querystring Request.QueryString        
</HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString    
</cc1:TabPanel>
对tabtrip的简单封装   js的querystring Request.QueryString    
<cc1:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel2" OnClientClick="onTab2Click">
对tabtrip的简单封装   js的querystring Request.QueryString        
<HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString            硬件信息
对tabtrip的简单封装   js的querystring Request.QueryString        
</HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString    
</cc1:TabPanel>
对tabtrip的简单封装   js的querystring Request.QueryString    
<cc1:TabPanel ID="TabPanel3" runat="server" HeaderText="TabPanel3" OnClientClick="onTab3Click">
对tabtrip的简单封装   js的querystring Request.QueryString        
<HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString            软件信息
对tabtrip的简单封装   js的querystring Request.QueryString        
</HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString    
</cc1:TabPanel>
对tabtrip的简单封装   js的querystring Request.QueryString    
<cc1:TabPanel ID="TabPanel4" runat="server" HeaderText="TabPanel4" OnClientClick="onTab4Click">
对tabtrip的简单封装   js的querystring Request.QueryString        
<HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString            进程信息
对tabtrip的简单封装   js的querystring Request.QueryString        
</HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString    
</cc1:TabPanel>
对tabtrip的简单封装   js的querystring Request.QueryString    
<cc1:TabPanel ID="TabPanel5" runat="server" HeaderText="TabPanel5" OnClientClick="onTab5Click">
对tabtrip的简单封装   js的querystring Request.QueryString        
<HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString            端口信息
对tabtrip的简单封装   js的querystring Request.QueryString        
</HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString    
</cc1:TabPanel>
对tabtrip的简单封装   js的querystring Request.QueryString    
<cc1:TabPanel ID="TabPanel7" runat="server" HeaderText="TabPanel7" OnClientClick="onTab6Click">
对tabtrip的简单封装   js的querystring Request.QueryString        
<HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString            操作日志
对tabtrip的简单封装   js的querystring Request.QueryString        
</HeaderTemplate>
对tabtrip的简单封装   js的querystring Request.QueryString    
</cc1:TabPanel>
对tabtrip的简单封装   js的querystring Request.QueryString
</cc1:TabContainer>
>

.cs:
对tabtrip的简单封装   js的querystring Request.QueryStringprotected void Page_Load(object sender, EventArgs e)
对tabtrip的简单封装   js的querystring Request.QueryString        {
对tabtrip的简单封装   js的querystring Request.QueryString            TabContainer1.ActiveTabIndex = int.Parse(this.GetQueryString("activeTab", "0"));
对tabtrip的简单封装   js的querystring Request.QueryString        }

如此,以后有增删tab,则到该用户控件中修改。
附getString定义:
}

重要提示:如果要去掉ajaxtab下面的内容框,只要自己做个样式,并将body样式置空就行了:


问题:在应用了该控件后,在文档协议为html4.0的页上,会出现一个白条,挡住tab的一部分。整了好久没搞定,但是只要把页面的协议改为最新的xhtml就不会有。
对tabtrip的简单封装   js的querystring Request.QueryString<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
对tabtrip的简单封装   js的querystring Request.QueryString
对tabtrip的简单封装   js的querystring Request.QueryString应改为:
对tabtrip的简单封装   js的querystring Request.QueryString
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

相关文章:

  • 2021-10-14
  • 2022-12-23
  • 2022-12-23
  • 2021-06-06
  • 2021-09-04
  • 2022-02-27
  • 2021-08-27
  • 2021-08-03
猜你喜欢
  • 2022-02-08
  • 2022-12-23
  • 2022-12-23
  • 2021-07-06
  • 2022-12-23
  • 2021-12-16
  • 2021-09-19
相关资源
相似解决方案