Submit form not hitting action, instead opening new page

Question

FYI, I am also populating a field model.VdiId from a partial page using jQuery. When I am clicking the submit button of the form page, It is redirecting me to a blank page, instead of hitting the BookVdi action of Booking controller. I am throwing exception and putting breakpoints which are not hitting as well.

Below is the View Code:

@model HVDI.Models.BookingViewModel

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}


@using (@Html.BeginForm("BookVdi", "Booking", FormMethod.Post))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary()
    <h4>Booking</h4>
    <hr />

    <div class="form-inline">


        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.VdiId, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.VdiId, new { htmlAttributes = new { @class = "form-control disabled" } })
                @Html.ValidationMessageFor(model => model.VdiId, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.BookingDate, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.BookingDate, new { htmlAttributes = new { @class = "form-control datepicker" } })
                @Html.ValidationMessageFor(model => model.BookingDate, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.TimeStart, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.TimeStart, new { htmlAttributes = new { @class = "form-control timepicker" } })
                @Html.ValidationMessageFor(model => model.TimeStart, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.TimeEnd, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.TimeEnd, new { htmlAttributes = new { @class = "form-control timepicker" } })
                @Html.ValidationMessageFor(model => model.TimeEnd, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="showing">
            <input type="button" class="align-content-end" onclick="" id="btnSearch" value="Search" />
        </div>

    </div>
    <br />
    <div class="form-group">
        <div class="table-dark" id="vdiSection">

        </div>
    </div>

    <br />
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Book" class="btn btn-default" />
        </div>
    </div>

}

Below is the Controller code:

public ActionResult Index()
        {
            return View();
        }


        [HttpPost]
        [ValidateAntiForgeryToken]
        public void BookVdi(BookingViewModel bookingDetails)
        {
            if (!ModelState.IsValid)
            {
                throw new Exception();
            }
                Booking newBooking = new Booking();
            newBooking.BookingDate = bookingDetails.BookingDate; //I am putting a breakpoint here
        }

It is opening a blank page: http://localhost:61110/Booking/BookVdi

Not sure what you mean by 'opening a blank page'. There are no 'pages' in MVC. Booking/BookVdi is a controller action. It might be worth showing the controller code for the HttpGet method too. — Jasper Kent, Apr 09 '20 at 15:24
Check F12 network tab -- look for your POST and inspect the details to verify it's posting the data you expect. Also, drop a breakpoint on the first line in your controller POST method and verify you're not hitting that exception you're throwing. — devlin carnate, Apr 09 '20 at 15:31
That is what is more confusing to me. Added the controller code — Abhiron Kar, Apr 09 '20 at 17:18

Jigar Sangoi · Accepted Answer · 2020-04-10T15:49:19.373

You see empty page because you might not return anything when action executed properly. Please change your code as per below.

    [HttpPost]
    [ValidateAntiForgeryToken]
    public void BookVdi(BookingViewModel bookingDetails)
    {
        if (!ModelState.IsValid)
        {
            ViewBag,Error = "Please, correct all errors.";
            return View("YOURVIEWNAMEFOR FORM");
        }
        Booking newBooking = new Booking();
        newBooking.BookingDate = bookingDetails.BookingDate; 
        // Write save code here
        return RedirectToAction("Index");  // you must redirect to something when action executed.
    }

Also add this ViewBag to see errors on view

@Html.AntiForgeryToken()
@Html.ValidationSummary()
@ViewBag.Error             // add this line
<h4>Booking</h4>

Also look at this question if you need specific model errors to be shown in view question

Submit form not hitting action, instead opening new page

1 Answers1