Gridview buttonfield not working properly

Question

User1027206698 posted

On my page I have a gridview with a buttonfield - ButtonType="Link" and Text="History" - but it's temperamental.

For example, sometimes it won't even be clickable and when it is clickable only the 1st character ('H') can be clicked, and not the whole word (History).

Is this a 'known' bug or am I doing something wrong?

This is the aspx code...

<asp:GridView ID="grdDStaff" runat="server" AutoGenerateColumns="False" CssClass="GridStyle" OnRowCommand="grdDStaff_RowCommand1">
    <Columns>
        <asp:BoundField DataField="SName" HeaderText="Name" />
        <asp:BoundField HeaderText="Position" DataField="Position" />
        <asp:BoundField HeaderText="Start Date" DataFormatString="{0:d}" DataField="Started" />
        <asp:BoundField HeaderText="Foundation" DataFormatString="{0:d}" DataField="Found" />
        <asp:BoundField HeaderText="Advanced" DataFormatString="{0:d}" DataField="Adv" />
        <asp:BoundField HeaderText="Controller &amp; BM" NullDisplayText="N/A" DataFormatString="{0:d}" DataField="CBM" />
        <asp:ButtonField Text="History" CommandName="View" ButtonType="Link">
            <ControlStyle ForeColor="#666666" />
        </asp:ButtonField>
    </Columns>
    <FooterStyle BackColor="White" ForeColor="#000066" />
    <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
    <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
    <RowStyle ForeColor="#000066" />
    <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
    <SortedAscendingCellStyle BackColor="#F1F1F1" />
    <SortedAscendingHeaderStyle BackColor="#007DBB" />
    <SortedDescendingCellStyle BackColor="#CAC9C9" />
    <SortedDescendingHeaderStyle BackColor="#00547E" />
</asp:GridView>

Answer 1

User-943250815 posted

Your GridView (alone as is) look fine, rendering link as expected: <a href="javascript:__doPostBack('GridView2','View$1')" style="color:#666666;">History</a>
Check in browser using F12

Answer 2

User1027206698 posted

Is it the fact that my grid is inside a panel which is inside an update panel that might be causing issues?  Something I probably should've mentioned in my post.

Answer 3

User-943250815 posted

Since you are talking about a control inside Update Panel, I recommend you get more info about how an Update Panel works, take attention to Triggers
https://docs.microsoft.com/en-us/previous-versions/bb386454(v=vs.140)

Answer 4

User-893317190 posted

Hi conners,

If you are using updatepanel , have you set updatepanel's ChildrenAsTriggers property?If you have set it to false, every contorl in the updatepanel will not cause post back.

For example, the code below will not cause ButtonField to post back.

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">

            <ContentTemplate>
                 <asp:GridView ID="grdDStaff" runat="server" AutoGenerateColumns="False" CssClass="GridStyle" >
    <Columns>
    
      
        <asp:ButtonField Text="History" CommandName="View" ButtonType="Link">
            <ControlStyle ForeColor="#666666" />
        </asp:ButtonField>
    </Columns>
  
</asp:GridView>
            </ContentTemplate>
        </asp:UpdatePanel>
    

But from your description, your button sometimes work and sometimes doesn't work.

What is more strange is that sometimes only the first character is clickable.

Only updatepanel could hardly cause this problem , maybe some css style will cause your problem, such as z-index, position absolute

Please check your css style, remove css that may cause your problem.

Best regards,

Ackerly Xu

Answer 5

User1027206698 posted

Please check your css style, remove css that may cause your problem.

OK, I think I've found the problem but don't understand why it's causing problems with this grid and not others.

The problem was/is setting 'wrap=false' or nowrap. When I set this the buttonfield doesn't work, and when I don't set it it works.

But like I said, I'm using the same css on other grids and they work.  I've copied and pasted  the code for the working grid (different page) but it doesn't work in this page.

So, could it be a page setting?

Answer 6

User-893317190 posted

Hi conners,

Do other grid have the same structure with this gridview?

There should be some differences between this grid and other grids.

Please check these differences , change the  code where this gridview is different from other gridview to see what causes wrap=false to make your gird not work.

Best regards,

Ackerly Xu

Answer 7

User1027206698 posted

It turns out my Boostrap column the gridview was in wasn't wide enough.

But thanks for your help.