use ajax.beginform in the view but controller does not recognize as ajax request

Question

It is na asp.net mvc 5 app developped useing vb.net I use Ajax.beginform in the view but the controller when it retuns the request, does not recognize as an ajax request. Here is the code for the view

<div Class="modal-dialog">
    <div Class="modal-content">
        <div Class="modal-header">
            <Button type="button" Class="close" data-dismiss="modal" aria-hidden="true"></Button>
            <h4 Class="modal-title">Edit Nome</h4>
        </div>
        @Using (Ajax.BeginForm("Edit", "Nomes", Nothing,
                                                New AjaxOptions With {.HttpMethod = "POST", .OnSuccess = "UpdateSuccess"},
                                                New With {.Class = "form-horizontal", .role = "form"}))

    @Html.AntiForgeryToken()
            @<div Class="modal-body">
...........
                    <div class="col-md-offset-2 col-md-20">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <input type="submit" class="btn btn-primary" value="Save Changes" />
                    </div>
                </div>
            </div>
        End using
    </div>
</div>

And her is the code for the controller

<HttpPost>
        <ValidateAntiForgeryToken()>
        Public Async Function Edit(modelNome As NomeVM) As Task(Of ActionResult)

            If Not ModelState.IsValid Then
                Response.StatusCode = CInt(HttpStatusCode.BadRequest)
                Return View(If(Request.IsAjaxRequest(), "Edit", "Edit"), modelNome)
            End If

            Dim nome As Nome = MaptoModel(modelNome)

            dbContext.Nome.Attach(nome)
            dbContext.Entry(nome).State = EntityState.Modified
            Dim task = dbContext.SaveChangesAsync()
            Await task

            If task.Exception IsNot Nothing Then
                ModelState.AddModelError("", "Unable to update the Nome")
                Response.StatusCode = CInt(HttpStatusCode.BadRequest)
                Return View(If(Request.IsAjaxRequest(), "Edit", "Edit"), modelNome)
            End If

            If Request.IsAjaxRequest() Then
                Return Content("success")
            End If

            Return RedirectToAction("Index")

        End Function

check your browser network tab and see what type of request it is when you submit the form (xhr or not) — Shyju, Jun 29 '17 at 14:55

score 0 · Answer 1 · answered Jun 29 '17 at 22:13

You are probably missing jquery.unobtrusive-ajax.min.js . You can not use a cdn, instead go to manage nuget. Install jquery.unobtrusive-ajax and reference it.

Credit to Using Ajax.BeginForm with ASP.NET MVC 3 Razor

Here is an example

View:

@ModelType VisualBasic.MyViewModel
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>IndexValid100</title>
    @*MAKE SURe these references are included*@
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    @*get nuget for jquery.unobtrusive-ajax.min, cdn is for mvc3 and won't work*@
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
</head>
<body>
    <div id="result"></div>
    @Using (Ajax.BeginForm("Index", New AjaxOptions With {.UpdateTargetId = "result"}))
        @Html.EditorFor(Function(model) model.Foo)
        @Html.ValidationMessageFor(Function(model) model.Foo)
        @<input type="submit" value="OK" />
    End Using
</body>
</html>

Controller/Model:

Imports System.ComponentModel.DataAnnotations

Public Class MyViewModel
    Public Property Foo() As String
End Class

Public Class HomeController
    Inherits System.Web.Mvc.Controller

    <HttpPost>
    Function Index(ByVal myViewModel As MyViewModel) As ActionResult
        Return Content("Thanks", "text/html")
    End Function

    Function Index() As ActionResult
        Return View(New MyViewModel())
    End Function

use ajax.beginform in the view but controller does not recognize as ajax request

1 Answers1