data-ajax-update and data-ajax-mode="replace" not working in dotnet core jquery unobtrusive ajax

Question

I have an anchor which should replace a grid with a partial view .

<a class="btn btn-primary" 
                        data-ajax="true" 
                        data-ajax-method="GET"
                        data-ajax-mode="replace"
                        data-ajax-update="content"
                        data-ajax-url="@Url.Action("add","user")"> Create User </a>
 <div class="row table-area">
    <div class="col-md-12" id="content">
        @Html.AjaxGrid(Url.Action("results", "user"))
    </div>
</div>

I see it calls the user action with partial view but it never updates the section with id="content".

Here is my controller method -

    [Route("add")]
    public IActionResult AddUser()
    {
        return PartialView("Partials/AddUser",new RegisterViewModel());
    }

Ideally it should replace the grid content with the partial view altogether but it is not replacing . The response status is 200 and I can see that the contents are being returned in response . Anybody has any idea what is the issue here ?

Have you tried changing`data-ajax-update="content"` to include in the id of the div like `data-ajax-update="#content"` — David B, Jan 30 '18 at 08:28
No I haven't tried that have to check that . But honestly I felt only giving `content ` should work — Joy, Jan 30 '18 at 08:29

score 9 · Accepted Answer · edited Jan 26 '19 at 21:37

9

Change data-ajax-update="content" to data-ajax-update="#content"

edited Jan 26 '19 at 21:37

Scott Baker

10,013
17
56
102

answered Sep 22 '18 at 14:20

Nick Turner

927
1
11
21

score 1 · Answer 2 · edited Aug 09 '18 at 08:24

1

Rather than using data-ajax-url, use the asp-controller and asp-action and the #content should work.

<a class="btn btn-primary" asp-controller="user" asp-action="add" 
                        data-ajax="true" 
                        data-ajax-method="GET"
                        data-ajax-mode="replace"
                        data-ajax-update="#content">Create User</a>

edited Aug 09 '18 at 08:24

D. Dahlberg

156
1
9

answered Mar 27 '18 at 04:22

Arunagirirajah Nirooshan

140
4

2

That defeats the purpose of the ajax tag helper – Nick Turner Sep 22 '18 at 14:19

data-ajax-update and data-ajax-mode="replace" not working in dotnet core jquery unobtrusive ajax

2 Answers2