asp中的bootstrap glyphicons:gridview排序后按钮消失

时间:2014-11-20 16:14:39

标签: c# asp.net twitter-bootstrap gridview glyphicons

我该怎么做才能解决这个问题?在asp:button里面的html需要修复才能显示,我使用这个方法(除非我点击任何列的标题对gridview进行排序,否则它会起作用):

private void FixGlyph(PlaceHolder ph, Button btn, string iconClass, string customLabelStye = "")
    {
        if (btn.Visible)
        {
            var g = new HtmlGenericControl();
            g.ID = "labelFor_" + btn.ID;
            g.TagName = "label";
            g.Attributes.Add("for", btn.ClientID);
            g.Attributes.Add("class", "" + btn.CssClass + "");
            if (customLabelStye != "")
            {
                g.Attributes.Add("style", customLabelStye);
            }
            g.InnerHtml = "<i class='" + iconClass + "'></i> " + btn.Text;
            ph.Controls.Add(g);
            btn.Attributes.Add("style", "display:none;");
        }
    }

我的gridview是这样的:

<asp:UpdatePanel ID="UpdatePanel2" runat="server">
    <ContentTemplate>
        <asp:GridView ID="GridView1" AllowPaging="True" AutoGenerateColumns="false" DataSourceID="AccessDataSource1" DataKeyNames="FICHA" runat="server" GridLines="None" OnSorted="GridViewFix" AllowSorting="true" CssClass="table table-hover table-striped" ShowFooter="true" PagerStyle-CssClass="bs-pagination text-center">
            <Columns>
                    <%-- Ficha del empleado --%>
                    <asp:TemplateField HeaderText="Ficha" SortExpression="FICHA">
                        <ItemTemplate>
                            <asp:Label ID="lblFicha" Text='<%# Eval("FICHA") %>' runat="server"></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                            <%-- columna de eliminar --%>
                    <asp:TemplateField HeaderText="<span class='glyphicon glyphicon-remove'></span>">
                        <ItemStyle Width="20" />
                        <ItemTemplate>
                            <asp:PlaceHolder ID="delPh" runat="server"></asp:PlaceHolder>
                            <asp:Button ID="delBtn" CssClass="btn btn-link " data-toggle="modal" ToolTip="Modify" data-target="#deleteModal" runat="server" autopostback="false" OnClick="delBtn_Click" />
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
        </ContentTemplate> 
    <Triggers>
    </Triggers>
</asp:UpdatePanel>

我的Page_Load就像这样

protected void Page_Load(object sender, EventArgs e)
    {
        foreach (GridViewRow row in GridView1.Rows)
        {
            Button dbtn = row.FindControl("delBtn") as Button;
            PlaceHolder dPH = row.FindControl("delPh") as PlaceHolder;
            FixGlyph(dPH, dbtn, "glyphicon glyphicon-remove", "padding:0 !important;");
        }
    }

我甚至尝试在gridview上使用onSorted事件:

protected void GridViewFix(object sender, EventArgs e)
    {
        foreach (GridViewRow row in GridView1.Rows)
        {
            Button dbtn = row.FindControl("delBtn") as Button;
            PlaceHolder dPH = row.FindControl("delPh") as PlaceHolder;
            FixGlyph(dPH, dbtn, "glyphicon glyphicon-remove", "padding:0 !important;");
        }
    }

被触发,显然找到了控件并修复了标签,但......然后在GridViewFix之后发生了一些事情并重新加载了组件,再次没有了glyphicons

2 个答案:

答案 0 :(得分:1)

我会把你的代码添加到Page_PreRender方法中的字形。在page_load之后,Gridview可能会触发并重新创建按钮控件。

答案 1 :(得分:1)

好吧,问题不是完全清楚..按钮有数据切换和数据目标属性,LinkBut​​tons没有,这就是为什么他们想要这么糟糕。我需要在我触发代码背后的事件的同时打开一个模态。所以这解决了问题:只需用javascript自己触发模态。

<asp:LinkButton ID="AddAreaBtn" runat="server" autopostback="false" OnClientClick="javascript:$('#BorrarAreaModal').modal('show');" OnClick="BorraArea_Click">
    <i aria-hidden="true" class="glyphicon glyphicon-remove"></i>
</asp:LinkButton>