Why partial view not rendering in the same page? (ASP.NET MVC 4)

Question

I've faced a problem for partial view displaying.

    //This is Controller Action 
//_AcademicInfo is the Partial view name
public PartialViewResult GetAcademicInfo(int empId)
        {
            var acad = _academicService.GetAcademinByEmp(empId);
            return PartialView("_AcademicInfo", acad);
        }

<!--Parent/caller page cshtml code-->

@Ajax.ActionLink(
            "Academic Details",
            "GetAcademicInfo",
            "Employee", new {empId = Model.Id},
            new AjaxOptions {UpdateTargetId = "AcademicDetails", InsertionMode = InsertionMode.InsertAfter}
            )

 <!--This is partial view cshtml-->
@model IEnumerable<Hik.PhoneBook.Data.Entities.Academic>

<div id="result">

    <table>
        <tr>
            <th>Degree Name</th>
            <th>Passing Year</th>
            <th>CGPA</th>
            <th>Institute</th>
        </tr>


        @foreach (var acad in Model)
        {
            <tr>
                <td>@Html.DisplayFor(m => acad.DegreeName)</td>
                <td>@Html.DisplayFor(m => acad.PassingYear)</td>
                <td>@Html.DisplayFor(m => acad.CGPA)</td>
                <td>@Html.DisplayFor(m => acad.Institute)</td>
            </tr>
        }

    </table>

</div>

As because, I need to get the partial view by a Link clicking, not by rendering directly like @Html.Partial("_AcademicInfo", Model.Academic). Thats why I've used Ajax.ActionLink. Whenever I click on "Academic Details" link, its executing the accurate result. But unfortunately its not displaying in the same page. Its going to appear in another page. (Its MVC 4)

What should I need to change to render the partial view in the same page?

That because you have not included the relevant scripts - you need to include jquery.unobtrusive-ajax.js — user3559349
– user3559349, Commented Apr 24, 2015 at 6:54
Yup I've used that already @section scripts { <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> } — LazyLoading
– LazyLoading, Commented Apr 24, 2015 at 6:59
Then you possibly have duplicates or other scripts out of order (jquery needs to be first). Edit your question to show all the scripts in the view — user3559349
– user3559349, Commented Apr 24, 2015 at 7:06
@sharmoon You'll also need to provide either a more complete example of the "parent" view, or include the rendered HTML. — Tieson T.
– Tieson T., Commented Apr 24, 2015 at 7:19
@StephenMuecke yup u r corrcet. My "jquery.unobtrusive-ajax.js" was set before main jQuery loading. But I cant mark your answer as correct answer coz there is no 'Right/Correct' sign besides ur answer. — LazyLoading
– LazyLoading, Commented Apr 24, 2015 at 10:02

user3559349 · Accepted Answer · 2015-04-24 10:13:49Z

3

If you are redirecting to a new page rather than staying on the same page, it means that jquery.unobtrusive-ajax.js is not loaded and @Ajax.ActionLink() falls back to a normal link.

Either you have either

not included the script
have the scripts in the wrong order (jquery{version}.js must come first)
You have duplicate scripts

answered Apr 24, 2015 at 10:13

user3559349

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

Comments

Morph · Accepted Answer · 2015-04-24 08:05:30Z

0

Maybe you can use jquery's .load() function ? Like this.

$("divId").load('@url.action("getacademicInfo")', {empId : 4});

https://api.jquery.com/load/

answered Apr 24, 2015 at 8:05

Morph

1,7191 gold badge18 silver badges23 bronze badges

Comments

A.K · Accepted Answer · 2015-04-24 12:27:13Z

0

Try using JQuery Ajax to load the partial view into the Div on the page on button/link click instead.

var jsondata = { Id: iddata };

$.ajax({
    url: "/Controllername/GetAcademicInfo",
    method: "POST",
    dataType: "html",
    data: jsondata,
    success: function (response) {
        $("#divId").html(response);

    }

});

Please note that this is just a sample code for giving you an idea.

Hope that helps!

edited Apr 24, 2015 at 12:27

answered Apr 24, 2015 at 7:46

A.K

5051 gold badge12 silver badges32 bronze badges

1 Comment

user3559349 Over a year ago

OP is returning a partial view, not json, so it need to be dataType: "html",

Collectives™ on Stack Overflow

Why partial view not rendering in the same page? (ASP.NET MVC 4)

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related