Search code examples
asp.netbuttonpostbacklinkbutton

asp LinkButton inside html Button tag


I have some Html code that contains the button tag "<button></button>".

I have noticed that if I place a linkbutton inside this element, the postback of the linkbutton will never occur.

So this is not working :

<button><asp:LinkButton ID="lnkExample" OnClick="lnkExampleBtn_Click"runat="server">Text</asp:LinkButton></button>

The server method "lnkExampleBtn_Click" will never be launched.

How come the postback doesn't work ?

Is there a way to have a linkbutton work inside the "button" tag ?

I also tried putting an href element with javascript _doPostback specific method, but that is not working either.


Solution

  • I've tried to reproduce your case.

    Here's code behind:

    public partial class Test : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
    
        }
    
        protected void btnTest_Click(object sender, EventArgs e)
        {
            lblTest.Text = "Test";
        }
    
        protected void btnTest2_Click(object sender, EventArgs e)
        {
            lblTest.Text = "Test2";
        }
    }
    

    And here's aspx:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="WebApplication1.Test" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:LinkButton ID="btnTest" runat="server" OnClick="btnTest_Click">Test</asp:LinkButton>
                <button><asp:LinkButton ID="btnTest2" runat="server" OnClick="btnTest2_Click">Test2</asp:LinkButton></button>
                <button><a href="http://www.google.com/">test</a></button>
                <asp:Label ID="lblTest" runat="server"></asp:Label>
            </div>
        </form>
    </body>
    </html>
    

    What I found is - it depends on browser. In Chrome it's possible to place LinkButton inside tags. In Firefox and IE 10 it's not.

    The reason why it's not working is simple - it's not allowed by the HTML 5 standard. You just can't embed a link inside a button.

    http://www.w3.org/TR/2011/WD-html5-20110525/the-button-element.html#the-button-element

    Link inside a button not working in Firefox