Error in rendering partial view in asp.net mvc ajax

Question

In asp.net ajax, the partial view response replaces the html and only the partial view is rendered. In the below snippet, when I click the ActionLink "Steps", the partial view is returned and replaces the Details.cshtml.

What I need is this partial view should replace only the "main-content-div" div.

Please help out. Thanks

View: Details.cshtml

<div class="main-body">

<table>
    <tr>
        <td class="left-sidebar extended">

            @Ajax.ActionLink("Steps", "Steps", new { id = ViewBag.Id }, new AjaxOptions { AllowCache = false, UpdateTargetId = "main-content-div", InsertionMode=InsertionMode.Replace })
        </td>
        <td class="main-wrapper">

            <div class="main-content" id="main-content-div">
                This is the default stuff which I'll be replacing...
            </div>
        </td>
        <td class="right-sidebar"></td>
    </tr>

</table>

Action Method:

[HttpGet]
    public PartialViewResult Steps(string id)
    {
        //reading model from db
        return PartialView("~/Views/Author/Exercise/_StepsPartial.cshtml", Model);
    }

Partial View:

@model IEnumerable<Model>
<div>
    <div>
        <input type="text" />
    </div>
</div>

Probably because you do not have the correct scripts loaded, or they are in the wring order. — user3559349
– user3559349, Commented Feb 7, 2015 at 11:27

James P · Accepted Answer · 2015-02-07 23:45:28Z

2

You need to add jquery.unobtrusive-ajax.min.js to your project for this to work.

Go to the Nuget Console Package Manager console and type:

Install-Package Microsoft.jQuery.Unobtrusive.Ajax

You then just need to add a reference at the top of your _Layout.cshtml or View to the relevant script:

<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

answered Feb 7, 2015 at 23:45

James P

2,2642 gold badges21 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Error in rendering partial view in asp.net mvc ajax

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related