3

In this question disabling the submit button to prevent multiple postbacks was a viable solution to stop (non-malicious) users from posting back multiple times.

This option doesn't work well if you have a view with multiple submit buttons. Take the following example.

//View:

@using (Html.BeginForm("Catalog", "Images", FormMethod.Post, new { onsubmit = "Utility.disable_buttons(this.id);", id = "catalog_form" }))
{
<p>
    <input type="submit" name="btnSubmit" value="Clear" /> |
    <input type="submit" name="btnSubmit" value="Catalog" /> |
    <input type="submit" name="btnSubmit" value="Update" /> |
    @Html.ActionLink("Back to List", "Index")
</p>
}

//Controller:

[HttpPost]
    public ActionResult Catalog(string btnSubmit)
    {
        switch (btnSubmit)
        {
            case "Catalog":
                //More differenter code
                break;
            case "Clear":
                //Different code
                break;
            case "Nothing":
                //Code
                break;
        }
        return View();
    }

In the view, there are three different submit actions. If the buttons are disabled, then their values won't be passed and the controller will not know which button triggered the submit. (The controller always gets null.) Unfortunately, the submitdisabledcontrols attribute does not seem to solve this problem in MVC. Does anybody know how to pass disabled control's values to the server?

Community
  • 1
  • 1
Coda
  • 387
  • 2
  • 9

2 Answers2

2

Some background info:

If you want to disable all buttons so they are no longer clickable but still want to know what the user clicked the only solution I can think of is a hidden field along with this code:

$(function() {
    $('input[type=submit]').click(function() {
        var form = $(this).closest('form');
        form.find('#hiddenField').val($(this).val());
        form.find('input[type=submit]').prop('disabled', true);
    });
});

If you just want to make sure the user cannot click the other buttons after clicking one you can do this:

$(function() {
    $('input[type=submit]').click(function(event) {
        $(this).closest('form').find('input[type=submit]').not(this).prop('disabled', true);
    });
});

Unfortunately there is no solution (I know of) to bind a handler to the form´s submit and determine which input was clicked. This is not a problem related to your question but makes the above code slightly more complicated.

Alex Lawrence
  • 1,160
  • 3
  • 10
  • 19
  • I ended up coming to the same conclusion. It appeared there were ways to allow disabled controls to be submitted back to the server (submitdisabledcontrols="true") but I could never get it to work. I ended up just doing server side changes to handle multiple button clicks. – Coda Oct 16 '13 at 15:36
0

you can try this

if (coll.AllKeys.Contains("Clear"))
{
  // your code here for this submit
}
Sascha Galley
  • 15,711
  • 5
  • 37
  • 51
Vijay Parmar
  • 795
  • 4
  • 13
  • That doesn't work at all. Request.ServerVariables (which I assume you're talking about) does not contain a key for that field. It doesn't get passed back to the server because it's disabled. This was fixable with webforms in ASP.net by putting the submitdisabledcontrols="true" attribute on the form. MVC3 is apparently different. – Coda Aug 31 '11 at 15:58
  • I was talking about the FormCollection Coll variable that can be passed as a paramater in a action while a action is called ,this collection have all the key name for all the submit buttons,in above example it is "Clear" button submit – Vijay Parmar Oct 17 '12 at 15:54