How to pass value from submit button to mvc dynamically?

Question

I started working with MVC from few days and got a question out of learning lot of ways to communicate between Controllers and Views in MVC

I have page that shows list of employees in tabular form.

Model is of type IEnumerable of Employee Model

It has three buttons they are Edit, Create, Delete, Details.

Requirement:
I used buttons so that all should be of HTTP Post request type because I do not want users to directly access them using URL requests.

Here is my view code:

@using (Html.BeginForm())
{
    <p>
        <input type="submit" name="CreateView" value="Create New(Post)" formaction="CreateView" formmethod="post" />
    </p>
    <table class="table">
        <tr>
            -------Headings of table-------
        </tr>
        @foreach (var item in Model)
        {
        <tr>
            <td>@Html.DisplayFor(modelItem => item.EmployeeName)</td>
            <td>@Html.DisplayFor(modelItem => item.EmployeeGender)</td>
            <td>@Html.DisplayFor(modelItem => item.EmployeeCity)</td>
            <td>@Html.DisplayFor(modelItem => item.DepartmentId)</td>
            <td>@Html.DisplayFor(modelItem => item.EmployeeDateOfBirth)</td>
            <td>
                <input type="submit" name="EditView" value="Edit(Post)" formaction="Edit" formmethod="post" /> |
                <input type="submit" name="DetailsView" value="Details(Post)" formaction="Details" formmethod="post" /> |
                <input type="submit" value="Delete(Post)" onclick="return confirm('Are you sure you want to delete record with EmployeeId = @item.EmployeeId')" />
            </td>
        </tr>
        }
    </table>
}

Here delete button works because I do not need the id of the employee. But for other actions like editing, deleting and details viewing I need to pass Employees Id to controller. But how do I pass the Id to the controller using submit button.

In get requests types I used to pass like this:

@Html.ActionLink("Details", "Details", new { id = item.EmployeeId })

For single submit button I used to pass data like this

@using (Html.BeginForm("Details", "BusinessLayer", FormMethod.Post, new { id = item.EmployeeId }))

Can any one tell me the approach that I can fallow to achieve this?

Multiple submits inside single form can be a bad idea. you can use button instead and with the help of javascript you can submit it. — Prashant Mohite
– Prashant Mohite, Commented Sep 23, 2016 at 12:29
Just create a form for each action and each item in the collection - @Html.BeginForm("Edit", "yourControllerName, new { id = item.EmployeeId })) { <input type="submit" value="Edit" /> } etc — user3559349
– user3559349, Commented Sep 23, 2016 at 12:33
@StephenMuecke yeah but we can have only one controller action to post right? and if are performing all there in one action we need to pass mode as Edit/delete/detail as emp id as optional parameter.Correct me if my approach is wrong — Prashant Mohite
– Prashant Mohite, Commented Sep 23, 2016 at 12:34
The id is being passed as a route parameter (new { id = item.EmployeeId }) And why would you want only one POST method instead of one for each action? (although you can do it by giving each submit button the same name (say name="action") and adding a parameter string action in your single POST method)` — user3559349
– user3559349, Commented Sep 23, 2016 at 12:36

Shyju · Accepted Answer · 2016-09-23 12:32:46Z

12

You can have 3 separate form tags, one for each button. Just make sure you have an input field inside the form for the data you want to pass. For example if your action method is accepting the EmployeeId with a a parameter called EmployeeId, you should have in input hidden field with the same inside the form.

@model IEnumerable<Employee>
<table>
@foreach(var item in Model)
{
   <tr>
       <td>@item.EmployeeName</td>
       <td>@item.EmployeeGender</td>
       <td>@item.EmployeeCity</td>
       <td>@item.EmployeeDateOfBirth</td>
       <td>
         @using(Html.BeginForm("Details","YourControllerName"))
         {
           <input type="hidden" name="EmployeeId" value="@item.EmployeeId" />
           <input type="submit" value="Details" />
         }
         @using(Html.BeginForm("Edit","YourControllerName"))
         {
           <input type="hidden" name="EmployeeId" value="@item.EmployeeId" />
           <input type="submit" value="Edit" />
         }
         @using(Html.BeginForm("Delete","YourControllerName"))
         {
           <input type="hidden" name="EmployeeId" value="@item.EmployeeId" />
           <input type="submit" value="Delete" />
         }
       </td>
   </tr>

}

Also remember, nested forms are invalid HTML. So make sure you do not have those.

answered Sep 23, 2016 at 12:32

Shyju

220k106 gold badges421 silver badges499 bronze badges

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

1 Comment

Nithin B Over a year ago

This one works for me. One said that using multiple submits inside single form is bad idea? Is It valid If so can any body give explanation?

Collectives™ on Stack Overflow

How to pass value from submit button to mvc dynamically?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related