submit from view to controller returns failure message

Question

I'm a newbie in MVC. The questions which im asking here may be very basic. But without solving that I couldnt cross the road of learning.

I have a simple controller and two views. My requirement is initially a view will be loaded and on a button click, this will be loaded in to another view. Since I dont know how to post from a view to controller without using an ajax submit, I attempted that and it works. But at the end, it is redirecting to the second view but later showing the ajax fail alert. Couldnt identify, where exactly it goes wrong. Below given the code.

Controller.

public class DashboardController : Controller
    {
        //
        // GET: /Dashboard/
        [HttpPost]
        public ActionResult LoginResult()
        {
            string strName = Request["username"].ToString();
            return View("Validateresult");
        }
        public ActionResult Index()
        {          
            return View();
        }
}

View1

@model MvcApplication5.Models.Employee
@{
    ViewBag.Title = "Dashboard";
}
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

    <h2>Dashboard</h2>

 @using (Html.BeginForm("LoginResult", "Dashboard", FormMethod.Post))
    {  
     @Html.EditorFor(model =>model.username)
    <button type="button" id="ajax_method">submit Via AJAX</button>

    }
<script>


    $(function () {
        $('#ajax_method').click(function (e) {
            e.preventDefault();
            var postData = {
                username: $("#username").val()

            };
            $.ajax({
                type: "POST",
                url: "/Dashboard/LoginResult",                            //Your Action name in the DropDownListConstroller.cs
                data: { username: $('#username').val() },  //Parameter in this function, Is case sensitive and also type must be string

                dataType: "json"

            }).done(function (data) {
                //Successfully pass to server and get response
                if (data.result = "OK") {
                    window.location.href = "Validateresult";
                    alert("submit successfully.");
                }
            }).fail(function (response) {
                if (response.status != 0) {
                    alert(1);
                    alert(response.status + " " + response.statusText);
                }
            });
        });

    });
</script>

View2

@{
    ViewBag.Title = "Validateresult";
}

<h2>Validateresult</h2>

Model

public class Employee
    {

            public string username { get; set; }
            public string age { get; set; }

    }

Can someone suggest a better solution to submit a view to controller and to another view or how to solve this issue?

Answer 1

Here' a simple example. 1st view Test loads. Clicking submit posts back to your controller with the model and then redirects to view Test2.

public class TestController : Controller
    {
        //
        // GET: /Test/

        [HttpGet]
        public ActionResult Test()
        {
            var model = new CurrentViewModel();
            return View("Test", model);

        }

        [HttpGet]
        public ActionResult Test2()
        {
            var model = new CurrentViewModel();
            return View("Test2", model);

        }

        [HttpPost]
        public ActionResult TestPost(CurrentViewModel model)
        {
            return RedirectToAction("Test2");
        }
    }

Test view with submit button.

    @using (Html.BeginForm("TestPost", "Test", FormMethod.Post))
    {
        <button type="submit">Submit</button>
    }