Question

I’m struggling with a very basic feature. I want to refer another view from the current view to load the content from that view by applying very basic ajax. here is the code:

<div>
    <ul id="biographies">
    <li> <a href="Ajax">Ajax</a></li>
    <li> <a href="Index">Index</a>  </li>

    </ul>    

    <div id="biography">
      The ajax content will appear here...
    </div>

    <script type="text/javascript">
        $("#biography").load('Ajax.cshtml');


    </script>

</div>

Both the page is in the same directory that is: views/home

• Question 1: how to pass the parameter for load event?
• Question 2: how to link to other pages using the anchor tag?

Thanks.

Answer 1

Use the Url.Action helper method:

$("#biography").load('@Url.Action("Ajax")');

Similarly, you can use Html.ActionLink to get an a tag for actions or routes:

@Html.ActionLink("Go to Index", "Index")

@Html.ActionLink("Go to Home:Index", "Index", "About")

The output will be like <a href='/About/Index'>Go to Home:Index</a>.

Remember, with MVC the idea is that URLs point to resources and routes, not to specific files.  It’s best to use these helper methods (rather than writing out hard-coded URLs) as they specify the route precisely.