---
title: "How can you return a partial view from a controller and inject it into a specific section in ajax"  
description: "How can you return a partial view from a controller and inject it into a specific section in ajax"  
author: "Anubhav Sharma"  
published: 2025-07-28  
updated: 2025-07-29  
canonical: https://www.mindstick.com/forum/161832/how-can-you-return-a-partial-view-from-a-controller-and-inject-it-into-a-specific-section-in-ajax  
category: "asp.net mvc"  
tags: ["mvc", "ajaxform"]  
reading_time: 2 minutes  

---

# How can you return a partial view from a controller and inject it into a specific section in ajax

**How can you return a [partial view](https://www.mindstick.com/articles/1132/auto-refresh-partial-view-in-asp-dot-net-mvc) from a [controller](https://www.mindstick.com/blog/273/passing-values-from-controller-to-view-in-asp-dot-net-mvc) and inject it into a specific [section](https://yourviews.mindstick.com/view/297/reservation-for-economically-weaker-section) of the [page](https://www.mindstick.com/articles/13031/why-to-make-a-wikipedia-page) using an [AJAX form](https://www.mindstick.com/forum/161834/how-do-you-handle-model-validation-errors-in-an-ajax-form-submission-without-reloading-the-page)?**

- [Describe](https://www.mindstick.com/interview/12752/what-is-ddms-describe-some-of-its-capabilities) the controller-side and [client](https://www.mindstick.com/articles/23198/3-steps-to-ensure-that-your-client-portal-is-impeccable)-[side code](https://www.mindstick.com/forum/143/close-popup-window-by-server-side-code) flow.

## Replies

### Reply by ICSM Computer

Returning a **[partial](https://www.mindstick.com/blog/78/partial-class-in-dot-net) view** from a controller and injecting it into a **specific section of the page** using an [**Ajax.BeginForm** is a common pattern in ASP.NET MVC for dynamic content](https://www.mindstick.com/interview/34342/how-does-the-ajax-beginform-helper-work-in-asp-dot-net-mvc) updates without reloading the whole page.

- Submit a form using AJAX (`Ajax.BeginForm`)
- Return a `PartialView` from the controller
- Inject the returned HTML into a DOM element specified via `UpdateTargetId`

## Controller Code

```cs
public ActionResult SubmitForm(MyViewModel model)
{
    if (ModelState.IsValid)
    {
        // Perform save or processing logic

        // Return a partial view to update part of the page
        return PartialView("_SuccessMessage", model);
    }

    // If validation fails, return a partial with errors or re-render the form
    return PartialView("_FormPartial", model);
}
```

### Notes:

- `_SuccessMessage.cshtml` and `_FormPartial.cshtml` are partial views (no layout).
- The return type is `ActionResult`, returning `PartialView(...)`.

## Client-Side View Code (Razor)

```cs
@model MyViewModel

<div id="formContainer">
    @using (Ajax.BeginForm("SubmitForm", "Home", new AjaxOptions
    {
        HttpMethod = "POST",
        UpdateTargetId = "formContainer", // Where to inject the result
        InsertionMode = InsertionMode.Replace,
        OnSuccess = "onSuccess",
        OnFailure = "onFailure"
    }))
    {
        @Html.EditorFor(m => m.Name)
        <input type="submit" value="Submit" />
    }
</div>
```

### Required Scripts:

```html
<script src="~/Scripts/jquery.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
```

## Partial View Example: `_SuccessMessage.cshtml`

```html
<div class="alert alert-success">
    Thank you, @Model.Name. Your submission was successful.
</div>
```

## Optional JavaScript Callbacks

```javascript
function onSuccess(result) {
    console.log("AJAX Success:", result);
}

function onFailure(xhr, status, error) {
    console.log("AJAX Failure:", error);
    alert("Something went wrong.");
}
```

## End-to-End Flow

1. **User fills the form and clicks Submit**
2. **Ajax.BeginForm:**

   1. Hijacks form submission via JavaScript
   2. Sends form data to the controller using AJAX

3. **Controller:**

   1. Processes data
   2. Returns a **partial view result** (HTML only) or JSON data (parse in [onSuccess function](https://www.mindstick.com/interview/34343/explain-how-client-side-events-like-onsuccess-onfailure-and-onbegin-work-in-an-ajax-form))

4. **Client:**

   1. Injects the partial view HTML into the element with `id="formContainer"` via `UpdateTargetId`

## Tips & Gotchas

- Ensure `jquery.unobtrusive-ajax.js` is **loaded after jQuery**
- Your partial views **should not include layout** (`_Layout.cshtml`)
- `UpdateTargetId` **must match** the DOM element where you want to inject


---

Original Source: https://www.mindstick.com/forum/161832/how-can-you-return-a-partial-view-from-a-controller-and-inject-it-into-a-specific-section-in-ajax

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.