I have the following repeater in an ASPX file. It’s a five-block slider that showcases 4 different activities, with a booking button at the bottom. My goal is to replace the button href dynamically, creating a sort of map that pairs the ID of the activity with my links.
E.g.
PackageId
54 = https://link1
So for the activity with PackageId
54 I want the button to have href="https://link1"
instead of href="BookSession.aspx?Id=<%#Eval("PackageId")%>"
<asp:Repeater runat="server" ID="rptData">
<ItemTemplate>
<div class="item">
<div class="card ">
<ul class="text-center">
<li>
<img src="<%#Eval("iCon").ToString()+"?"+DateTime.Now.Ticks %>" <%--.Replace("../Photo","https://Images.thesmashroom.com")style="height:70px; width:60px"--%> alt="" /></li>
<li>
<h2 class="redColor"><%#Eval("PackageName") %></h2>
</li>
<li>
<h4 class="text-white"><%# string.Join("<br />", Eval("OneLineDescription").ToString().Split(new []{","},StringSplitOptions.None)) %></h4>
</li>
<li>
<h4 class="text-white"><%#"AED "+ Eval("Price") %></h4>
</li>
<!--<li><p class="text-white">( <%# Eval("total_persion") %> person / 1 room )</p></li> -->
<li><p class="text-white">( <%# Eval("total_persion") %> person)</p></li>
<li>
<div class="clearfix"></div>
</li>
<li>
<a href="BookSession.aspx?Id=<%#Eval("PackageId")%>" >Book Now</a>
</li>
</ul>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
I tried to add a php array mapping the list of 4 IDs with my list of 4 links and of course it didn’t work with ASP.NET.
I tried to search for an ASP.NET version of the same array, no luck.
Any suggerstion?
2
Answers
You need to do something like this:
Then modify the button in the repeater’s ItemTemplate as follows:
And in the Page_Load event, bind the data to the repeater:
it would be likely better to drop the hyper link, and simple use/have a button click in place of that link.
The only real question is how and where do you define that 54 is to be link 1, and how do you determine that 56 is supposed to be link3? Is that information from the database?
So, you can drop in a simple button into that repeater, and when clicked on, it can "use" or "enjoy" information about that one row clicked on, and that includes the "id" and the "link" we want to use based on that ID.
However, I can’t imagine that these numbers are "random", and thus a reasonable guess is that this "id" has some information associated (some place – maybe the database) that holds information as to what link is to be used.
While we wait for you to come back and provide that information, here is how a repeater button works, and how it can "pick up" the current row information, and pluck out values from that one one. (and the button can even then hit the database to pull more information – even information that you don’t necessary include in that repeater row for display.
So, say a few rows of some information about fighter jets.
When we click on the button, we can then get/have information about the rows.
So, say this markup:
And code behind to load is this:
and now we see/get this:
But, note the button code in the above repeater.
So, now code behind is this:
And thus if I click on the view button, we get this:
output:
So, in place of a hyper link, it really in most cases less effort to just drop in a button, and then use that, and as above shows, we can get information about the given row clicked on, or use the database PK id we passed to code behind to do whatever we want, including that of a navigation based on that ID value.
So, the only remain question is how and where do you decide that say id 53 is to be some particular link? (you certainly do NOT want to hand code, or hard code such values in code behind, but explain how and where this information exists to determine that link, and then use code behind to build/create and navigate to wherever you want based on this information.
So, we can I suppose hard code based on that say PK id, say like this:
Or, as suggested in other post – use a dictionary or some format.
Say, like this code (assuming we have MyPK).
And, if you want, you could create/use/have the expression in markup, but often it somewhat more messy to do so, means two places to maintain, but either approach is fine – much comes down to your personal preference. however, ONLY code behind, or markup tags with runat="server" can use the above "~/" to mean the root base of the web site. In JavaScript, or markup, you can’t use "~/" to represent the root of the site, so if such links are external, then you want to use the full URL, but for internal links to the given site, then you can use/enjoy use of "~/" in code behind – and thus such links are easier in code behind and a response.redirect().