Only Update (refresh) PartialView After Submit Click

I am having trouble only updating the contents of my partial view after clicking a input type='submit' button. I wish to only refresh the partial view and fill it with the updated

Solution 1:

Set event.preventDefault() on form submit, it will restrict the page to refresh.

$("#ValidationForm").serialize() will serialize your data and that pass to your action.

$("#ValidationForm").submit(function (event) {
event.preventDefault();       

$.ajax({
    url: '@Url.Action("CalculationValidation", "Home")',
    dataType: 'json',
    data: $("#ValidationForm").serialize(),
    type: 'POST',
    success: function (result) {
        $("#dvCalculationResult").html(result);
    },
    error: function (xhr) {
    }
});
});