如何生成动态选项卡

时间:2021-11-10 06:23:11

1:前台HTML:  <div id="Divtag" runat="server">

前台JS:

//传入标签ID,并触发按钮事件

 function Tagclick(tag_value) {
            document.getElementById('<%=hdfTag.ClientID %>').value = tag_value;
            document.getElementById('<%=btnTagClick.ClientID %>').click();

}

<asp:HiddenField ID="hdfTag" runat="server" />
    <div style="visibility: hidden">
        <asp:Button ID="btnTag" runat="server" OnClick="btnTagClick" />//按钮事件
    </div>

 

2:首先获取含有动态标签名与动态标签的ID的集合;如datable:

 foreach (DataRow dr in tag.Tables[0].Rows)
            {

                divHtml = String.Format("<a onclick=\"Tagclick('{0}')\">{1}</a>", dr["TagID"], dr["TagName"]);
                TableCell td1 = new TableCell();
                TableCell td2 = new TableCell();
                TableCell td3 = new TableCell();

                if ((dr["TagID"].ToString() == PID))
                {

                   //当为选中状态时标签的颜色发生改变
                    td1.Attributes.Add("style", "background-image:url(/Image/lab1.gif); background-repeat:no-repeat; width:4px; height:25px;");
                    td2.Attributes.Add("style", "background-image:url(/Image/lab2.gif); background-repeat:repeat-x;");
                    td3.Attributes.Add("style", "background-image:url(/Image/lab3.gif); background-repeat:no-repeat; width:4px; height:25px;");
                }
                else
                {

                    //未选中时
                    td1.Attributes.Add("style", "background-image:url(/Image/lab11.gif); background-repeat:no-repeat; width:4px; height:25px;");
                    td2.Attributes.Add("style", "background-image:url(/Image/lab12.gif); background-repeat:repeat-x;");
                    td3.Attributes.Add("style", "background-image:url(/Image/lab13.gif); background-repeat:no-repeat; width:4px; height:25px;");
                }

                td2.Controls.Add(new LiteralControl(divHtml));
                this.Divtag.Controls.Add(td1);
                this.Divtag.Controls.Add(td2);
                this.Divtag.Controls.Add(td3);
            }