How can I call controller post action from jquery (in custom view page) in mvc .net web app

Question

I am creating a web application for event management using .net mvc and jquery. I created a mvc web app.contoller named SeatPlansController and model named SeatPlanes and I am able to insert the data to database. But I am not able pass the data from jquery to database using the mvc controller.

My controller action code is as shown below


    // GET: SeatPlans/Create
    public ActionResult Create()
    {
        return View();
    }

    // POST: SeatPlans/Create
    // To protect from overposting attacks, please enable the specific properties you want to bind to, for 
    // more details see http://go.microsoft.com/fwlink/?LinkId=317598.
    [HttpPost]
    [ValidateAntiForgeryToken]

 public ActionResult Create(String seat_id, String seat_no)
        {
            int id = 10;
            SeatPlans S = new SeatPlans();
            S.seat_id = seat_id;
            S.seat_no = seat_no;
            if (ModelState.IsValid)
            {


                db.SEATPLAN.Add(S);
                db.SaveChanges();
              //  return RedirectToAction("Index");
            }

            return View(S);
        }

In post create controller Id is primary key, so I want to pass seat_id,seat_no as argument and it should update the database.

I used following javascript

function getPerson(id) {

    $.ajax({
        type: "GET",
        url: '@Url.Action("create", "SeatPlanesController")',
        contentType: "application/json; charset=utf-8",
        data: {eat_id :6, seat_no:8},
        dataType: "json",
        success: function (result) {
            alert(result);
            //window.locationre = result.url;
        }
    });
}

I am able to run the create get method using

http://localhost:52348/SeatPlans/Create

but how can I run post method directly from browser with argument something like

http://localhost:52348/SeatPlans/Create/2/3t/e

I have changed the script as bellow,it works for GET method but if i made TYPE:"post" it popup an alert box with alert "localhost:52348 says: internal server error"





     $(document).ready(function () {
            $("button").click(function () {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: '@Url.Action("Create", "SeatPlans", new { Area = "" })',
                    data: { seat_id: "34", seat_no: "98" },
                    dataType: "json",
                    async: false,
                    success: function (result) {
                        $("#div1").html(result);
                    },

                    error: function (abc) {
                    alert(abc.statusText);
                    },



                });
            });
        });

You need to pass the data to the controller using the data: option - e.g. data { ID: 1 }. But you ajax call is a GET, not a POST. Its unclear what your trying to do and what you want to pass to the controller since your GET method does not even have any parameters — user3559349
A POST method doesn't have the posted parameters in the url, so you cannot 'run it directly from browser'. And then there's what @StephenMuecke said... — Stephen

Unknown Unknown · Accepted Answer · 2016-04-22T09:12:20

Finally i got the sollution i changed the script as bellow


        //jQuery.noConflict();
      //  var $j = jQuery.noConflict();

        function clickevent()
        {
            var form = $("#frm");
            var token = $('input[name="__RequestVerificationToken"]', form).val();
                $.ajax({
                    type: "post",
                  //  headers: { "__RequestVerificationToken": token },
                    url: '@Url.Action("Create", "SeatPlans")',
                    data: {
                        seat_id: "34", seat_no: "98"
                    },
                    success: function (result) {


                            $("#div1").html(result);

                    }
                });
            }

and change the create post method as bellow

<pre>


    public ActionResult Create(String seat_id, String seat_no)
    {
        int id = 10;
        SeatPlans S = new SeatPlans();
        S.seat_id = seat_id;
        S.seat_no = seat_no;
        if (ModelState.IsValid)
        {


            db.SEATPLAN.Add(S);
            db.SaveChanges();
          //  return RedirectToAction("Index");
        }

        return View(S);
    }

How can I call controller post action from jquery (in custom view page) in mvc .net web app

1 Answers