18

How do I use an asp:Button or asp:LinkButton as asp:Hyperlink?

The existing Hyperlink just goes to another section on the same page: NavigateUrl="#Section2"

I want to do this in the aspx file without additional coding. Thanks.

The purpose is to have a button look instead of the underlined text BUT I don't want to use an image with hyperlink to achieve this purpose.

Liam
  • 22,818
  • 25
  • 93
  • 157
user763554
  • 1,921
  • 8
  • 23
  • 32
  • 1
    why to do that and not direct use a Hyperlink ? – Aristos Dec 26 '12 at 00:54
  • 7
    Back to HTML basics (as commented by Aristos): Why would you even consider ASP.Net controls for such? There is no rule in ASP.Net that you "should" always use controls. A simple [hyperlink](http://www.w3schools.com/html/html_links.asp) will do. You can `style` it as you wish... – EdSF Dec 26 '12 at 01:22

5 Answers5

22

You can use OnClientClick event to call a JavaScript function:

<asp:Button ID="Button1" runat="server" Text="Button" onclientclick='redirect()' />

JavaScript code:

function redirect() {
  location.href = 'page.aspx';
}

But i think the best would be to style a hyperlink with css.

Example :

.button {
  display: block;
  height: 25px;
  background: #f1f1f1;
  padding: 10px;
  text-align: center;
  border-radius: 5px;
  border: 1px solid #e1e1e2;
  color: #000;
  font-weight: bold;
}
joecop
  • 865
  • 10
  • 17
Nils Anders
  • 3,622
  • 3
  • 23
  • 37
  • Doesn't seem to work the redirect on click... should that be single quote? – aspiring May 13 '15 at 07:25
  • Yes, this redirect() method is not working properly, we get inside the method but location.href = 'page.aspx'; does not redirect to page. – Piotr P Dec 06 '19 at 11:04
19

There is a middle way. If you want a HTML control but you need to access it server side you can simply add the runat="server" attribute:

<a runat="server" Id="lnkBack">Back</a>

You can then alter the href server side using Attributes

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
       lnkBack.Attributes.Add("href", url);
    }
}

resulting in:

<a id="ctl00_ctl00_mainContentPlaceHolder_contentPlaceHolder_lnkBack" 
      href="url.aspx">Back</a>
Liam
  • 22,818
  • 25
  • 93
  • 157
  • 1
    This solution uses an anchor, not a button. To use this method you must also consider the visible display of the link which may require some CSS manipulation. – barrypicker Jun 12 '18 at 19:38
9

The best way to accomplish this is by simply adding "href" to the link button like below.

<asp:LinkButton runat="server" id="SomeLinkButton" href="url" CssClass="btn btn-primary btn-sm">Button Text</asp:LinkButton>

Using javascript, or doing this programmatically in the page_load, will work as well but is not the best way to go about doing this.

You will get this result:

<a id="MainContent_ctl00_SomeLinkButton" class="btn btn-primary btn-sm" href="url" href="javascript:__doPostBack(&#39;ctl00$MainContent$ctl00$lSomeLinkButton&#39;,&#39;&#39;)">Button Text</a>

You can also get the same results by using using a regular <a href="" class=""></a>.

mackhax0r
  • 428
  • 1
  • 6
  • 15
3

This can be done very easily using a PostBackUrl and a regular button.

<asp:Button ID="Button1" runat="server" Text="Name of web location" PostBackUrl="web address" />
Jamie
  • 481
  • 2
  • 10
0

you can use linkbutton for navigating to another section in the same page by using PostBackUrl="#Section2"

Deanira Fadrinaldi
  • 21
  • 4