Asked by:
Firefox renders link button as command buttons on gridview

Question
-
User2103134756 posted
Firefox seems to be rendering the link buttons on all the gridviews as command buttons. Tried adding border: 0px; but no use. No problems on chrome or IE 11. It does change on the hover but they definitely look like buttons and not links.
a.GvCmd { text-decoration: none; color: #465c71; font-weight: 600; border: 0px; } a.GvCmdDisabled { text-decoration: none; color: #999999; font-weight: 600; border: 0px; }
Sunday, July 28, 2019 10:50 PM
All replies
-
User288213138 posted
Hi oneillj,
Based on your description, I try to reproduce your problem.
But I tested it with your code and the style is the same in chrome,IE11 and FireFox.
Do you mean you want to add border to LinkButton?
If this is your requirement, I suggest you could try to set it as below codes:
<style> #LnkButtion { border: 1px solid #aaa; text-decoration: none; font-family: Arial; color: black; padding: 1px 6px; font-size: 13px; background: #eee; } #LnkButtion:hover { background: #D0F5F4; } </style> <asp:LinkButton ID="LnkButtion" runat="server" Text="Button" />
If I misunderstand your requirement, please post more details information about your requirement.
Best regards,
sam.
Monday, July 29, 2019 3:10 AM -
User2103134756 posted
What is actually happening, it seems, that the linkbutton is rendered as command button. I thought somehow there was a border around it but that was the border of the command button. There are three methods used in this program. One is the gv's DataRowBound event. The other 2 are in a utilities class that disable and enable all the linkbuttons during an edit so the user can't do an operation on a row. Here is the calling code, the utility methods and the event code. At the very bottom is the rendered source on one of the gv rows. It doesn't matter what gets called or what page is executing, every gridview renders the same way in FF.
protected void SetFormState() { //Browse Mode if (GlobalVars.CurrentMode == (int)Modes.Browse) { //Set button status btnCreateNew.Enabled = true; btnSave.Enabled = false; btnCancel.Enabled = false; //Reset form FormUtilities.ResetForm(this.Form); lblLastLoginDate.Text = string.Empty; lblCreationDate.Text = string.Empty; //Lock form controls FormUtilities.LockFormInput(this.Form); //Enable Gridview buttons FormUtilities.EnableGridviewRows(grdUsers, SELECT_COL, DELETE_COL); //Clear and disable user role dropdown drpUserRole.Items.Clear(); drpUserRole.Enabled = false; } //Edit Mode if (GlobalVars.CurrentMode == (int)Modes.Edit) { //Set button status btnCreateNew.Enabled = false; btnSave.Enabled = true; btnCancel.Enabled = true; //Unlock form FormUtilities.UnlockFormInput(this.Form); //Disable username textbox on edit txtUserName.Enabled = false; //Disable gridview buttons on edit or new FormUtilities.DisableGridviewRows(grdUsers, SELECT_COL, DELETE_COL); //Enable user role dropdown drpUserRole.Enabled = true; //Set focus to last name textbox txtLastName.Focus(); } . . . Code continues FormUtilities Methods /// <summary> /// Enables Gridview rows after form edit or /// other operation that requires disabling of controls. It /// also attaches a deleteConfirm script to the delete /// button in the last column. /// </summary> /// <param name="gv"></param> public static void EnableGridviewRows(GridView gv, int selectCol, int deleteCol) { //Init table cell TableCell cell = new TableCell(); //Traverse through the rows foreach(GridViewRow gvr in gv.Rows) { //If data row if (gvr.RowType == DataControlRowType.DataRow) //Change the cssClass back to normal widths for //the Select and Delete buttons gv.Columns[selectCol].ControlStyle.CssClass = "GvCmd"; gv.Columns[deleteCol].ControlStyle.CssClass = "GvCmd"; cell = gvr.Cells[selectCol]; //Gets the linkbutton control LinkButton lbSelect = cell.Controls[1] as LinkButton; lbSelect.Enabled = true; //Get last cell cell = gvr.Cells[deleteCol]; string recordName = string.Empty; if (gv.ID == "grdUsers") { //Gets the name on the row to pass to script. recordName = HttpUtility.JavaScriptStringEncode(string.Format("{0} {1}", gvr.Cells[3].Text.ToString(), gvr.Cells[2].Text.ToString())); } if (gv.ID == "grdVenues") { recordName = HttpUtility.JavaScriptStringEncode(string.Format("{0}", gvr.Cells[1].Text.ToString())); } if (gv.ID == "grdSchedule") { recordName = HttpUtility.JavaScriptStringEncode(string.Format(" the gig on {0} at {1} with {2} at {3}", gvr.Cells[1].Text.ToString(), gvr.Cells[2].Text.ToString(), gvr.Cells[3].Text.ToString(), gvr.Cells[4].Text.ToString())); } //Gets the linkbutton control LinkButton lbDelete = cell.Controls[1] as LinkButton; //Attaches the script to the linkbutton if (lbDelete != null) { //lbDelete.Enabled = true; lbDelete.Attributes.Add("onClick", "return deleteConfirm('" + recordName + "')"); } gvr.Enabled = true; } } /// <summary> /// Disables Gridview rows on form edit or /// other operation that requires disabling of controls. It /// also changes the command button styles to disabled and /// removes a deleteConfirm script on the delete /// button in the last column. /// </summary> /// <param name="gv"></param> public static void DisableGridviewRows(GridView gv, int selectCol, int deleteCol) { TableCell cell = new TableCell(); foreach (GridViewRow gvr in gv.Rows) { if (gvr.RowType == DataControlRowType.DataRow) { if (gvr.RowIndex == gv.EditIndex) { gv.Columns[selectCol].ControlStyle.CssClass = "GvCmd"; } else { gv.Columns[selectCol].ControlStyle.CssClass = "GvCmdDisabled"; gv.Columns[deleteCol].ControlStyle.CssClass = "GvCmdDisabled"; cell = gvr.Cells[selectCol]; LinkButton lbSelect = cell.Controls[1] as LinkButton; string id = lbSelect.ID; string txt = lbSelect.Text; lbSelect.Enabled = false; //Disable delete buttons cell = gvr.Cells[deleteCol]; LinkButton lbDelete = cell.Controls[1] as LinkButton; lbDelete.Attributes.Remove("onClick"); //lbDelete.Enabled = false; gvr.Enabled = false; } } } } DataRowBound Event /// <summary> /// Adds a confirm delete javascript attr to the delete /// link button on the last column of the gridview /// </summary> /// <param name="sender"></param> /// <param name="e"></param> protected void GrdUsers_RowDataBound(object sender, GridViewRowEventArgs e) { HiddenField hdnEditFlag = mp.Page.FindControlRecursive("hdnEditInProgress") as HiddenField; if (hdnEditFlag.Value == true.ToString()) return; //Inits new cell TableCell cell = new TableCell(); //if data row if (e.Row != null && e.Row.RowType == DataControlRowType.DataRow) { //Gets the name on the row to pass to script. string recordName = string.Format("{0} {1}", e.Row.Cells[3].Text.ToString(), e.Row.Cells[2].Text.ToString()); //gets the delete button cell cell = e.Row.Cells[7]; //get linkbutton control LinkButton linkButton = (LinkButton)cell.Controls[1]; //Adds the javascript attribute that confirms a delete. if (linkButton != null) { linkButton.Attributes.Add("onClick", "return deleteConfirm('" + recordName + "')"); } } } Here is how it renders on the view source <tr class="GrdVeiwAltRow"> <td class="GvCmdCol"> <a id="MainContent_grdUsers_grdUsersSelect_3" class="GvCmd" href="javascript:__doPostBack('ctl00$MainContent$grdUsers$ctl05$grdUsersSelect','')">Select</a> </td><td>OrrS</td><td>Orr</td><td>Sean</td><td>SeanOrr@comcast.net</td><td>6/17/2019 11:05:06 PM</td><td>7/27/2019 1:13:09 AM</td><td class="GvCmdCol"> <a onclick="return deleteConfirm('Sean Orr');" id="MainContent_grdUsers_grdUsersDelete_3" class="GvCmd" href="javascript:__doPostBack('ctl00$MainContent$grdUsers$ctl05$grdUsersDelete','')">Delete</a> </td> </tr>
Monday, July 29, 2019 8:25 PM -
User288213138 posted
Hi oneillj,
that the linkbutton is rendered as command button. I thought somehow there was a border around it but that was the border of the command buttonDo you mean there is a border around the link button? and you want to get rid of this border?
if so, you should post you aspx code, otherwise I can't reproduce your problem.
Best regards,
Sam
Wednesday, July 31, 2019 11:16 AM -
User2103134756 posted
No it's actually a command button. I uploaded a public FB image. Maybe you guys can get to it from here. Let me know if you can't.
https://www.facebook.com/photo.php?fbid=2458392327516222&set=a.173603799328431&type=3&theater
Thursday, August 1, 2019 11:30 PM -
User288213138 posted
Hi oneillj,
I get the picture.
Do you means select is linkbutton and It rendered as a command button in firefox?
If so, please post your aspx code so that I can help you solve the problem further.
Best regards,
sam
Tuesday, August 6, 2019 11:23 AM -
User2103134756 posted
Sam,
Here is one of the gridview controls on the page but they all render the same in FF. In my last post, I left a link to this gv in my last post that shows you exactly how it renders. It's on my FB page but it's a public post so, you shouldn't have to log in and friend me to view it.
<td colspan="3"> <asp:GridView ID="grdVenues" runat="server" AutoGenerateColumns="False" ClientIDMode="Static" DataKeyNames="VenueID" TabIndex="22" onrowdeleting="GrdVenues_RowDeleting"> <AlternatingRowStyle CssClass="GrdVeiwAltRow" /> <Columns> <asp:TemplateField ShowHeader="False"> <ItemTemplate> <asp:LinkButton ID="lbSelect" runat="server" CausesValidation="False" CommandName="Select" Text="Select" CommandArgument="SelectVenue" onclick="VenueFormCommands"></asp:LinkButton> </ItemTemplate> <ControlStyle CssClass="GvCmd" /> <ItemStyle CssClass="GvCmdCol" /> </asp:TemplateField> <asp:BoundField DataField="VenueName" HeaderText="Venue" > <ItemStyle CssClass="VenName" /> </asp:BoundField> <asp:BoundField DataField="Address" HeaderText="Address" > <ItemStyle CssClass="VenAddress" /> </asp:BoundField> <asp:BoundField DataField="City" HeaderText="City" > <ControlStyle CssClass="VenCity" /> <ItemStyle CssClass="VenCity" /> </asp:BoundField> <asp:BoundField DataField="State" HeaderText="St" > <ItemStyle CssClass="VenState" /> </asp:BoundField> <asp:BoundField DataField="ZipCode" HeaderText="Zip" > <ItemStyle CssClass="VenZip" /> </asp:BoundField> <asp:TemplateField ShowHeader="False"> <ItemTemplate> <asp:LinkButton ID="lbDelete" runat="server" CausesValidation="False" CommandName="Delete" Text="Delete" CommandArgument="DeleteVenue" onclick="VenueFormCommands"></asp:LinkButton> </ItemTemplate> <ControlStyle CssClass="GvCmd" /> <ItemStyle CssClass="GvCmdCol" /> </asp:TemplateField> </Columns> </asp:GridView> </td>
Tuesday, August 6, 2019 10:01 PM