Thursday, 29 April 2021

Load Partial view (MVC) into a div dynamically using Ajax in MVC or MVC Core

Load Partial view (MVC) into sectionPatient div dynamically using Ajax

<div id="sectionPatient"></div>

var patientInfoUrl = '@Url.Action("ActionName", "ControllerName")';


1. Using Post method

        var patientObj = {};

        patientObj.LastName = $('#s_txtLastName').val();

        patientObj.FirstName = $('#s_txtFirstName').val();

        patientObj.PatientBirthDate = $('#s_txtPatientDOB').val();

        patientObj.EMail = $('#s_txtEmailAddress').val();

        patientObj.MobileNumber = $('#s_txtMobilePhone').val();


        $.ajax({

            url: patientInfoUrl,

            contentType: "application/json; charset=utf-8",

            type: 'POST',

            dataType: 'html',

            data: JSON.stringify(patientObj),

            success: function (data) {

                $('#sectionPatient').html(data);

            },

            error: function (ehr) {

                console.log(ehr);

            }

        });


2. using Get method

$('#sectionPatient').load(patientInfoUrl, function () {

        });