Update Partial view using AJAX

Question

_{Sunday, March 1, 2020 11:50 PM}

Hello,

I have a controller name "Students", and there is a main view for this controller named > "Index", in the Views folder of this controller "Students" there is sub folder "PartialViews", and it has 3 Partial Views.. so the tree will be as below

• Controllers
  • Students
• Views
  • Students
    • PartialViews
      • _StudentInformation
      • _StudentAddresses
      • _StudentMarks
    • Index

and in the Index view as below

<div class="step active" data-step-title="page" data-step="1" style="display:none" id="content1">
                    @{Html.RenderPartial("PartialViews/_StudentsInformation", Model); }
                </div>
                <div class="step" data-step-title="page" data-step="2" style="display:none" id="content2">
                    @{Html.RenderPartial("PartialViews/_StudentsAddresses", Model); }
                </div>
                <div class="step" data-step-title="page" data-step="3" style="display:none" id="content3">
                    @{Html.RenderPartial("PartialViews/_StudentsMarks", Model); }
                </div>
</div>

In ActionResult Index in Student Controller, I don't want to fill all field and information in ViewModel, I want once user move from step 1 to step2 then call ajax to refresh the PartialView with ViewModel has it own information.

Thanks.

All replies (2)

_{Tuesday, March 3, 2020 5:12 AM ✅Answered}

Hi Khalid Salameh,

I want once user move from step 1 to step2 then call ajax to refresh the PartialView with ViewModel has it own information.

Not sure what defines the process from step 1 to step2 which should also be the trigger of your expected ajax.

Please refer to How to use jquery or ajax to update razor partial view in c#/asp.net for a MVC project, in this thread, the demo shows how to call ajax and update the partial view.

Best Regard,

Yang Shen

_{Tuesday, March 3, 2020 6:30 PM}

Thanks Yang, its working