Multiple submit buttons with values passed from buttons

Question

The way I have structured the form is that there are multiple "Test Connection" submit buttons plus a "Save" submit button to save all the credentials and urls for each test connection. I have seen some suggested solutions but I don't feel like doing an ajax or javascript. So I'm wondering if this is possible. And by the way, I would like to pass values to the controller via the submit buttons as enum values and receive that enum in my controller.

I could easily make multiple ActionResults but it just feels so convoluted for me and if I have to change something in the test connection, I would have to change all. So I would like to have only one ActionResult method for TestConnection plus one Save ActionResult all within the same form.

When I click the Save button, all the credentials are sent to the controller as the ApplicationSettings model.

When I click the Test Connection button, I still receive the ApplicationSettings model plus the DatabaseSystems enum and depending on the enum received form the button, I would do the necessary connection.

Below are the code snippets but I just can't make them work.

Approaches tried: 1. Blank form action, submit buttons has name as "Save" and "TestConnection" accordingly. - Save works. TestConnection does not work saying The resource cannot be found. 2. Form action pointed to "TestConnection", TestConnection button names set as "database" while value set as @DatabaseSystems.xxx, Save button set as "action:Save", ActionResult method for Save added [MultipleButton(Name = "action", Argument = "Save")] - TestConnection works, Save does not work saying ambiguous request.

I can't seem to figure out the config to make them both work. :(

View

@using Models.Enums
@model MyApp.Data.ApplicationSettings

@Html.AntiForgeryToken()
@using (Html.BeginForm())
{
<div class="row">
    <div class="col-md-2">
        @Html.EditorFor(model => model.con1_un, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con1_un) } })
    </div>
    <div class="col-md-2">
        @Html.EditorFor(model => model.con1_pw, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con1_pw) } })
    </div>
    <div class="col-md-7">
        @Html.EditorFor(model => model.con1_url, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con1_url), @rows = "1", @style = "max-width:520px !important" } })
    </div>
    <div class="col-md-1 pull-right">
        <button type="submit" class="btn btn-warning pull-right" name="database" value="@DatabaseSystems.System1" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span>  Test Connection</button>
    </div>
</div>
<div class="row">
    <div class="col-md-2">
        @Html.EditorFor(model => model.con2_un, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con2_un) } })
    </div>
    <div class="col-md-2">
        @Html.EditorFor(model => model.con2_pw, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con2_pw) } })
    </div>
    <div class="col-md-7">
        @Html.EditorFor(model => model.con2_url, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con2_url), @rows = "1", @style = "max-width:520px !important" } })
    </div>
    <div class="col-md-1 pull-right">
        <button type="submit" class="btn btn-warning pull-right" name="database" value="@DatabaseSystems.System2" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span>  Test Connection</button>
    </div>
</div>

<div class="row">
    <div class="col-md-2">
        @Html.EditorFor(model => model.con3_un, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con3_un) } })
    </div>
    <div class="col-md-2">
        @Html.EditorFor(model => model.con3_pw, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con3_pw) } })
    </div>
    <div class="col-md-7">
        @Html.EditorFor(model => model.con3_url, new { htmlAttributes = new { @class = "form-control", @placeholder = Html.DisplayNameFor(model => model.con3_url), @rows = "1", @style = "max-width:520px !important" } })
    </div>
    <div class="col-md-1 pull-right">
        <button type="submit" class="btn btn-warning pull-right" name="database" value="@DatabaseSystems.System3" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span>  Test Connection</button>
    </div>
</div>

... and many more test connections for different systems

<button type="submit" class="btn btn-success pull-right" name="Save" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-floppy-disk"></span> Save</button>
}

Controller

[HttpPost]
ActionResult TestConnection(ApplicationSettings model, DatabaseSystems database)
{
    // depending on the DatabaseSystems enum passed, then I'll do the necessary connection check.
{
[HttpPost]
ActionResult Save(ApplicationSettings model)
{
    // Save credentials entered in all the input fields above for con1, con2 & con3.
}

Model

[Serializable]
public class ApplicationSettings
{
    public string con1_un { get; set; }
    public string con1_pw { get; set; }
    public string con1_url { get; set; }

    public string con2_un { get; set; }
    public string con2_pw { get; set; }
    public string con2_url { get; set; }

    public string con3_un { get; set; }
    public string con3_pw { get; set; }
    public string con3_url { get; set; }

    ... and many more systems
}

Enum

public enum DatabaseSystems
{
    System1,
    System2,
    System3,
    ... and many more systems
}

What do you mean without compromising the other? And you have @using (Html.BeginForm()) which means your form will submit back to the POST method with the same name as the GET method (you have not said what that is) - you would need a bit a javascript to post back to separate methods (although its unclear why you need separate methods) — user3559349
– user3559349, Commented Jun 6, 2017 at 4:24
I would like to stay away from one ActionResult method and do the segregation inside. Instead, I would like the view itself to do the segregation for me so when I click TestConnection, it goes directly to the TestConnection method, etc. — leahsaif
– leahsaif, Commented Jun 6, 2017 at 4:36
I have tried before: Controller public ActionResult TestConnectionSystem1(ApplicationSettings model, DatabaseSystems database) public ActionResult TestConnectionSystem2(ApplicationSettings model, DatabaseSystems database) public ActionResult TestConnectionSystem3(ApplicationSettings model, DatabaseSystems database) then View <button type="submit" class="btn btn-warning pull-right" name="action:TestConnectionSystem1" id="@DatabaseSystems.System1" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span> Test Connection</button> — leahsaif
– leahsaif, Commented Jun 6, 2017 at 4:37

leahsaif · Accepted Answer · 2017-06-06 05:55:31Z

2

Finally got it. Though @Stephen Muecke did not really provide a direct solution, I should say he made me reconsider using formaction again so I still have to thank him. Thanks mate! Below is how I solved it:

View

@using Models.Enums
@model MyApp.Data.ApplicationSettings

@Html.AntiForgeryToken()
@using (Html.BeginForm())
{
    ...
    <button type="submit" class="btn btn-warning pull-right" name="database" value="@DatabaseSystems.System1" formaction="Admin/TestConnection" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span>  Test Connection</button>
    ...
    <button type="submit" class="btn btn-warning pull-right" name="database" value="@DatabaseSystems.System2" formaction="Admin/TestConnection" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span>  Test Connection</button>
}

Controller

public ActionResult TestConnection(ApplicationSettings model, DatabaseSystems database)
{
    // at the end, instead of putting return View() or return("Index", model), I used below code
    return Redirect("/[ControllerName]");
{

... this way, formaction will do the calling of the ActionResult method for me while keeping the name attribute of the button free for other purposes such as passing it as a parameter to my TestConnection method.

answered Jun 6, 2017 at 5:55

leahsaif

1093 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

John Foll Over a year ago

Thanks! I had tried the idea of putting my action into the value attribute of the button type=submit, but that did not work right. I was getting some weird error when calling my HtmlCust - missing source to the generic class / function. I tried putting a string parameter with a Model and string buttonname parameter as suggested by some, the call would work on submit, but buttonname was always empty. But using formaction="myActionName" worked - it actually called my custom non default action! A lot of the solutions were probably pre MVC 5.x - maybe that was why they didn't work?

NIts577 · Accepted Answer · 2017-06-06 05:07:56Z

1

Use single action name with different parameters for multiple submit button.and give name is same in both button but value is different

for check connectin

<button type="submit" class="btn btn-warning pull-right" name="save" value="@DatabaseSystems.System3" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span>  Test Connection</button>

for save

<button type="submit" class="btn btn-warning pull-right" name="Save" value="save" data-toggle="collapse" data-target="#loading"><span class="glyphicon glyphicon-link"></span>  Save</button>


    [HttpPost]
    ActionResult Save(ApplicationSettings model,string Save)
                {
    if(Save=="Testconnection")
    {
     //do your code on save
    }
    if(save="Save")
    {
     //do your code on save
     }
      }

edited Jun 6, 2017 at 5:07

answered Jun 6, 2017 at 4:23

NIts577

4203 silver badges13 bronze badges

3 Comments

leahsaif Over a year ago

I'm afraid this one does not work too mate. Controller does not recognize which method is being invoked.

NIts577 Over a year ago

i have modified my answer please check.

leahsaif Over a year ago

@Nlts577, thanks for the suggestion but that's exactly what I'm trying to avoid. I would like to let MVC do the segregation for me instead of me doing such codes. :D

Collectives™ on Stack Overflow

Multiple submit buttons with values passed from buttons

2 Answers 2

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related