Search code examples
jqueryasp.net-mvcform-submitsubmit-button

mvc form method='post' with two submit buttons


I've reviewed several posts here for a solution. I'll try a fresh question.

my form:

<form method="post" action="@Url.Action("Manage")"  data-cs-ajax="true" data-cs-target="#catalogList" >

It has an auto complete field and paging, very similar to the OdeToFood example from Scott Allen.

There is :

<input type="submit" value="Update" class="btn btn-default" />

which updates some filtered items to selected from - all works great - and also:

<input type="submit" name="btnSave" id="btnSave" value="Save" class="btn btn-default" />

They both successfully hit:

//POST: /WebCatalog/Manage/5
[HttpPost, ActionName("Manage")]
[ValidateAntiForgeryToken]
public ActionResult Manage([Bind(Include = "Id,CatalogId,CatalogColourId,CatalogSizeId,CatalogCategoryId,CatelogSupplierId,StartDate,EndDate,Active,isSubmitted")] WebCatalogViewModel model, string searchTerm = null, int page = 1)
    { ...

They do hit the controller action because of the javascript:

$(function () {

var ajaxFormSubmit = function () {
    var $form = $(this);

    var options = {
        url: $form.attr("action"),
        type: $form.attr("method"),
        data: $form.serialize()
    };

    $.ajax(options).done(function (data) {
        var $target = $($form.attr("data-cs-target"));
        var $newHtml = $(data);
        $target.replaceWith($newHtml);
        var options = {};
        $newHtml.effect("highlight", options, 500, doneEffect);
    });

    return false;
};

Now...

I want to set a field in the model to let the controller know the second btnSave button was clicked...to save the record, of course....

Soo...

$(function () {

    $("#btnSave").click(function () {

        $("isSubmitted").val("1");
        return true;
    });

});

And that fires: before the page is submitted via ajax in ajaxFormSubmit, the button jQuery code for $(#btnSave") does successfully fire.

However, in the controller action, isSubmitted is always 0.

I've tried :

$("isSubmitted").val(1);

I've tried the form as method='get' and still no post - although, I might try to then change the method with javascript in the btnSave.click js function - not sure how to do that...if I can't save a value in a form control, then why would I be able to change the form method??

I've tried an $Ajax.ActionLink - but always get a 500 IIS error.

Basically, I need a way to know that the user clicked the save button, rather than the Update button.

Any advice is appreciated!


Solution

  • @Robert Achmann, here is my answer

    It seems the selector in $("isSubmitted") is missing, e.g. $("#isSubmitted") for an input with an id isSubmitted.