Page reloading after save data in MVC.

Hello Sorabh,

Without page load and Ajax call, you can use partial view in mvc application,

Please find solution below,

Create form inside a view

@model YourNamespace.Models.YourModel


    @using (Html.BeginForm("SaveData", "YourController", FormMethod.Post, new { id = "saveForm", enctype = "multipart/form-data" }))
    {
        @Html.TextBoxFor(m => m.Name, new { @placeholder = "Enter your name" })
        Save
    }

    

        
    
}

Create controller for api and submission to your form,

public class YourController : Controller
{
    [HttpPost]
    public PartialViewResult SaveData(YourModel model)
    {
        if (ModelState.IsValid)
        {
            // Example: Call your API or save data
            // Simulating a successful API call
            bool isSuccess = CallYourApi(model.Name);

            // Return a partial view with a response message
            ViewBag.Message = isSuccess ? "Data saved successfully!" : "Failed to save data.";
            return PartialView("_Response");
        }

        ViewBag.Message = "Validation failed. Please correct the errors.";
        return PartialView("_Response");
    }

    private bool CallYourApi(string name)
    {
        // Implement your API call logic here
        // Example: return true if success, false otherwise
        return !string.IsNullOrEmpty(name);
    }
}

Create a partial view called _Response.cshtml.

    
@ViewBag.Message

Update the Form Container Dynamically

@using (Html.BeginForm("SaveData", "YourController", FormMethod.Post, new { id = "saveForm", target = "responseIframe" }))
{
    @Html.TextBoxFor(m => m.Name, new { @placeholder = "Enter your name" })
    Save
}

This approach ensures a clean MVC structure while achieving dynamic updates on the page without requiring extensive JavaScript.