Using an HTML Action Link to target a div

Question

I am new to ASP/MVC and I am having trouble figuring out how to link a div to a page in HTML markup. This is the current link in pure HTML. I want to accomplish this, but in razor syntax

<div class="col-md-2">
    <a href="ambulance.html">
        <div class="amb item">
            <div class="tiletext">AMB</div>
            <div class="tilesubtext">Ambulance</div>
        </div>
    </a>
</div>

I've been looking into action links, but if there is a better way to accomplish this, I'm open to it!

The MVC style way to link to another page is to use an ActionLink and create an action in the controller that returns that view. There isn't really a reason to have a plain HTML file in an MVC project. — Coda17, May 23 '14 at 19:16
Well, I've developed the front end in HTML/CSS and am handing it over to a back end developer to have it turned into an MVC web application. And he mentioned creating action links instead of using the hard links to make it easier on him, since he didn't know where everything was going. Is there a way I can set this up to make it easier on him? — Clive_Bigsby, May 23 '14 at 19:19
It's *his* job to create the action links because it's *his* job to create the actions. You shouldn't really be concerned with where anything links (and you certainly shouldn't be concerned with his MVC actions). The action links come *after* the actions themselves. Sounds like he needs to read the spec. — Ant P, May 23 '14 at 19:24

score 17 · Accepted Answer · edited May 23 '17 at 11:47

Possible duplicate. I'll add a bit of explanation that pertains to the question since it has to do with Razor:

What your backend developer needs is Url.Action helper. This will let you route the link through the MVC framework.

So say:

<div class="col-md-2">
    <a href="@Url.Action("Cars", "Ambulance")">
        <div class="amb item">
            <div class="tiletext">AMB</div>
            <div class="tilesubtext">Ambulance</div>
        </div>
    </a>
</div>

ASP.NET MVC: generating action link with custom html in it

Ufuk Hacıoğulları · Answer 2 · 2014-05-23T19:34:31.347

2

Html.ActionLink method only creates anchor tags for some action method, you need Url.Action method. Using the rest of the markup is fine.

<div class="col-md-2">
    <a href="@Url.Action("Index","Home")">
        <div class="amb item">
            <div class="tiletext">AMB</div>
            <div class="tilesubtext">Ambulance</div>
        </div>
    </a>
</div>

edited May 23 '14 at 19:34

answered May 23 '14 at 19:27

Ufuk Hacıoğulları

37,978
12
114
156

Using an HTML Action Link to target a div

2 Answers2