This isn't exactly Fermat's last theorem, but it keeps coming back to annoy me like an unpaid phone bill from college. Sometimes I want to create a HyperLink that does not cause a postback, so I want the target url to be #. When the markup happens to be from a UserControl in a subfolder,
/
|- Home.aspx (uses UC.ascx)
|- Sub
|- UC.ascx
the URL is rewritten with a relative path, e.g.
<asp:HyperLink runat="server" NavigateUrl="#" >Click Me!</asp:HyperLink>
becomes
Click Me!
Which is, unfortunately, wrong. Obviously I can get around this by not using a server control, but it seems stupid. Can this be avoided?
The point here is I will add a click event with jQuery or in code-behind, and I never want it to cause a postback, but I want it to be a hyperlink for CSS reasons.
easy way:
<asp:HyperLink ID="HyperLink1"
navigateUrl="#"
onclick="javascript:return false;"
runat="server">HyperLink</asp:HyperLink>
or
<asp:HyperLink ID="HyperLink1"
href="#"
runat="server">HyperLink</asp:HyperLink>
or jquery add a class to the link you don't want to have a postback (nopostback) :
$("a.nopostback").bind('click', function () {
return false;
})
You can set attributes for server-side elements.
<asp:HyperLink ID="HyperLink1" runat="server" Text="Click me"
href="#" style="color: red;" />
In the code-behind as well, using Attributes property
HyperLink1.Attributes
Actually, adding the control to the page without the href/NavigateUrl attribute(s) offers the greatest flexiblity.
<asp:HyperLink ID="HyperLink1" runat="server"/>
Then assigning the href attribute in your code behind looks like Bruno's answer:
HyperLink1.Attributes.Add("href","{your-value-here}");
Though, Bruno and Caspar's answers work they break in certain contexts. For example, say your HyperLink control is nested in a Repeater. If you then wanted to conditionally set the href attribute to an actual URL or '#' those approaches will not work. The '#' will be rendered every time.
Related
Is there a good reason why I can't do this
<asp:Button runat="server" ID="Btn1" OnClick='<%# Response.Redirect("wibble.aspx?ID=" + Eval("ID")) %>'/>
I get a compilation error:
The best overloaded method match for 'System.Convert.ToString(object, System.IFormatProvider)' has some invalid arguments
I appreciate I can create a code behind routine to handle the redirect but I would like to be able to create these type of buttons on the fly.
I can use a <asp:HyperLink> and it works fine using the NavigateUrl property, but why can't I do this with a button?
You can use the OnClientClick attribute instead. This will allow you to add Javascript code for the onclick HTML attribute.
<asp:Button runat="server" ID="Btn1" OnClientClick="window.location ='wibble.aspx?ID=<%# Eval("ID")).ToString() %>"/>
You can not do this as this will be rendered as input[type=submit] as html in browser, and for html its not functionality to redirect when you click on button.
If you have such request of having hyperlink in button , ASP.net gives linkbutton control , which will solve your need.
<asp:linkbutton PostBackUrl="~/something.aspx?id=1" runat="server">LinkButton</asp:linkbutton>
Does anyone know what is wrong with the following two lines of code? In both cases, there is no href in the anchor links when i view it in the browser:
<asp:HyperLink runat="server" NavigateUrl='<%# Eval(Request.QueryString["conferenceId"], "~/Cms/schedule-edit.aspx?conferenceId={0}&type=workshopStream") %>' Text="Create Workshop Stream"></asp:HyperLink>
<asp:HyperLink runat="server" NavigateUrl='<%# String.Format("~/Cms/schedule-edit.aspx?conferenceId={0}&type=scheduleItem", Request.QueryString["conferenceId"]) %>' Text="Create Schedule Item"></asp:HyperLink>
This exact same code seems to work fine when I put it into the ItemTemplate of a Listview though. But it doesn't work when used on it's own in an aspx file.
What's wrong with it?
Also if i replace the navigateUrl with a hardcoded string ~/cms/schedule-edit.aspx?conferenceId=2&type=stuff then the href shows up. It just doesn't work when i have the Eval or String.Format in there.
If those HyperLink server controls are located outside of DataBound controls like GridView, there are two problems in our code -
You want to use <%= %> instead of <%# %> which is used in DataBound controls.
You cannot use <%= %> to set property of a server control. Basically, you cannot mix runat="server" with <%= %>.
Solution
<a href='<%= String.Format("~/Cms/schedule-edit.aspx?conferenceId={0}&type=scheduleItem",
Request.QueryString["conferenceId"]) %>'>Create Workshop Stream</a>
The anchor syntax NavigateUrl='<%#...%> is only valid inside a GridView, ListView, etc. When it is not inside such controls, you can set its NavigateUrl property via code. Obviously, you also need to give an ID to your HyperLink.
The markup:
<asp:HyperLink ID="HyperLink1" runat="server" Text="Create Schedule Item"></asp:HyperLink>
The code behind:
HyperLink1.NavigateUrl = String.Format("~/Cms/schedule-edit.aspx?conferenceId={0}&type=scheduleItem", Request.QueryString["conferenceId"])
You are using a data-binding expression here. This is denoted in the following syntax:
<%# [code] %>
The code inside is evaluated only when the containing control, or any of its ancestors have their .DataBind() method called.
To work this around, you can:
Call Page.DataBind()
This could have some unwanted consequences if you have other data-bound controls on the page, as this method will cause all of them to have their data-binding events fired. Usually, this approach is applied if you have minimalistic code-behind and the entire page relies on data-binding expressions.
Give each HyperLink an ID and call HyperLinkID.DataBind();
Stick to the approach in codingstill's answer by setting the NavigateUrl property in the code behind of your page/user control.
Maybe I've forgotten how to use these, but I am going crazy trying to inject a server-side value into an HTML output. There are reasons why I am doing this inline, and not server-side, so please don't suggest that as a solution.
This code on the server side:
<asp:Label ID="Label1" runat="server" Text='<%= DateTime.Now.ToString() %>' />;
Renders as this in the client HTML sent to the browser:
<span id="Label1"> <%= DateTime.Now.ToString()></span>;
And it displays as big fat empty space, and nothing output to the interface.
If I change the ASP source to using the "#" character to define as data-binding syntax, then the rendered output to browser becomes:
<span id="Label1"></span>
EDIT:
Setting Label text was just a simplified object for the sake of asking the question. In real life, I am setting the CssClass attribute, which does not allow me to use the "wrapping" workaround some have suggested. I wanted to set a public property and have all the controls update from it dynamically on page load.
Ideally, since I already have all the controls laid out on the aspx page. Just looking to add an attribute. I wanted to have:
<asp:textbox ID='MyTxtBox1' CssClass='<% strVal1 %>' />
<asp:textbox ID='MyTxtBox2' CssClass='<% strVal1 %>' />
<asp:textbox ID='MyTxtBox3' CssClass='<% strOtherVal %>' />
<asp:textbox ID='MyTxtBox4' CssClass='<% strVal1 %>' />
Now what it looks like I need to do is repeat all my (250+) controls on the codebehind in a block of code that looks like:
MyTxtBox1.CssClass=strVal1
MyTxtBox2.CssClass=strVal1
MyTxtBox4.CssClass=strVal1
MyTxtBox3.CssClass=strOtherVal
I believe that may not work on a compiled Web Application as it's not interpreted at run-time like a C# "Web Site". However, I was able to get it to work wrapping the label around the value:
<asp:Label runat="server"><%= DateTime.Now.ToString() %></asp:Label>
Set the Label1.Text = value instead of trying to use server side attrs inside of the server control
I need to create a link for an ASP.NET page that has an image & text, which when clicked will trigger an event on the webserver.
This is what the link should look like:
This is the HTML for what the link would look like if I wasn't working with ASP.NET:
<a id='PdfLink' href='#'>
<img src="App_Themes/.../Images/PDF.gif" alt="Click for fact sheet PDF"/>
<span>Latest Performance</span>
</a>
The problem with this is that I want to be able to click this and trigger an server-side event, but I don't know if I can do that with plain old HTML controls.
With ASP.NET I can see that there are various controls such as ImageButton & HyperLink but I don't see how I can have a Hyperlink & an ImageButton as part of the same clickable control.
What's the best way for me to get a link similar to the image that is bound to server-side functionality?
I wouldn't do this by using a mixture of controls.
I would use a <asp:LinkButton> control
<asp:LinkButton id="LinkButton1" runat="server" OnClick="ButtonClick_Event" CssClass="latest-performance">Latest Performance</asp:LinkButton>
Then I would use the CssClass "latest-performance" to style up the link.
e.g.
.latest-performance{
display: block;
padding-left: 20px;
background: url(url-to-the-pdf-icon) no-repeat left center;
}
You will have to tweek the style to fit with what you need, but this will basically look exactly the same as what you need. It also keeps your code clean, and separates out the style.
You can do like..
<asp:LinkButton ID="LinkButton1" runat="server"
Text="<img src='App_Themes/.../Images/PDF.gif' /> PdfLink"></asp:LinkButton>
To do what you want to do in ASP .NET you'd need to do something like this:
<asp:LinkButton ID="LinkButton1" runat="Server" OnClick="ButtonClick_Event">Text</asp:LinkButton>
<asp:ImageButton ID="ImageButton1" runat="Server" ImageUrl="image.gif" OnClick="ButtonClick_Event"></asp:ImageButton>
You could then write a custom server or user control to encapsulate those controls so they only expose the properties you wish to set once, such as the event when clicked.
<a href="../default.aspx" target="_blank">
<img src="../images/1.png" border="0" alt="Submission Form" />
<br />
<asp:Literal ID="literalID" runat="server">Some text</asp:Literal></a>
The benefit of this is that asp:Literal is lightweight. You can also programmatically change the text inside the asp:Literal, by using literalID.Text in the code behind, if you need to. I like this because you only need to use a single control inside of a simple tag. You can give it whichever href, target, and img you want. Hope this helps.
You can do like this, this answer is correct.
<asp:HyperLink ID="hyperlink1" runat="server" NavigateUrl="Default.aspx" Target="_parent"><img src="Images/1.jpg"/>click</asp:HyperLink>
I have a page with different placeholders. In one of them, I have a link that I want to open a modal popup in a second placeholder (using the ajaxtoolkit ModalPopupExtender) :
<asp:Content ID="content1" ContentPlaceHolderID="placeholder1" Runat="Server">
<asp:LinkButton ID="link" runat="server" Text="Popup link" />
</asp:Content>
<asp:Content ID="content2" ContentPlaceHolderID="placeholder2" Runat="Server">
<asp:Panel ID="panel" runat="server" Text="Popup content" />
<ajaxToolkit:ModalPopupExtender ID="popup" runat="sever"
TargetControlID="link"
PopupControlID="panel"
/>
</asp:Content>
When doing as above, it fires me an exception, saying that popup cannot find link (which I understand, because they are in two different placeholders).
How can I make this work ? I can think of something find FindControl in the code behind, but I don't really like to use this function, as it is pretty computationally expensive (especially with my nested layout).
One issue is that your TargetControlID and PopupControlIDs are reversed. TargetControlID is the ID of the item that you want to 'Modal Pop', in your case that would be Panel1. The PopupControlID is the ID of the control that would trigger the ModalPopup, in your case that would be "Link"
But you still have a few options if that doesn't work, I have fired a modal located in a different update panel before using the method below. Though not the exact same issue, this workaround may help you (I am assuming you have a script manager on your page).
Create a hidden element in Content2 with ID="hiddenLink"
Set your ModalExtender PopupControlID="hiddenLink"
In the codeBehind for "link" in content1, add an onClick event with the following
ModalPopup1.show()
If you are using updatePanels, this will cause the ModalPopup to display in AJAX fashion without page refresh.But you would still get a full postback worht of data between the client and the server.
Method 2, you could use a javascript function to show to Modal as well. Add a behaviorID="MyModal1" (or whatever you want to call it) to your Modalpopup definition. Then change your link:
<asp:LinkButton ID="link" runat="server" Text="Popup link" OnClientClick="$get('MyModal1').show(); return false;"/>
Note: The return false in the above example prevents the .NET page from performing a postback.