James Peel
James Peel

Reputation: 179

MVC more than one image submit button

I have two image buttons that I want to use as submit buttons. Previously I only had one and that is working perfectly, however after adding the second one I've been struggling to get it to work. Effectively what I want is a general save button, and then another to do a different command.

I've been looking around and the use of "command" being passed from the view to the controller seems to be the way to go, and definitely works with standard submit input elements, however with an image it doesn't pass through the command value.

What I have is below:

View Buttons:

<input type="image" name="Command" value="Save" title="Save Changes" src="~/Content/Images/Save.png" border="0" alt="Save Changes" id="Save" class="Toolbar-Icon" />

<input type="image" name="Command" value="SignOff" title="Sign Off" src="~/Content/Images/Sign-Off.png" border="0" alt="Sign Off" id="SignOff" class="Toolbar-Icon" />

Controller Code:

[HttpPost]
    public ActionResult Edit(tblfault tblfault, string command)
    {
        if (command == "Save")
        {
            /*Code*/
        }
        else if (command == "SignOff")
        {
            /*Code*/
        }
    }

Is there a way to get the command value to pass into the controller, or do I have to go with a different option because i'm using image buttons?

Upvotes: 0

Views: 277

Answers (1)

Prashant Mohite
Prashant Mohite

Reputation: 798

<input type='hidden' name="command" id="command"/>

have it in your form

Then for your images have it like

<input type="image" name="Command" value="Save" data-id='Save' title="Save   Changes" src="~/Content/Images/Save.png" border="0" alt="Save Changes" id="Save" class="Toolbar-Icon" onclick="submitInfo(this);" />

<input type="image" name="Command" data-id='SignOff' value="SignOff" title="Sign Off" src="~/Content/Images/Sign-Off.png" border="0" alt="Sign Off" id="SignOff" class="Toolbar-Icon" onclick="submitInfo(this);" />

and the Javascript function

<script>
  function submitInfo(ele)
 {
    $('#command').val($(ele).attr('data-id'));
    $('form').submit();
 }
 </script>

In this way, you can also have a separation with hidden field value posted to controllers.

Upvotes: 1

Related Questions