MVC JavaScript inside foreach block

Question

The textbox should be filled up with values from the table when the dedicated button is pressed.

@Html.TextBoxFor(model => model.Users, new { @id = "Name" }) 

... there for I need a button in every line of the table.

@foreach (var user in Model.Users) { <tr> <td> <input type="button" value="get" id="btnTakeOver" class="btn btn-primary" /> </td> <td>@user.Id</td> <td>@user.Name</td> <td>@user.Email</td> </tr> } 

But I have the problem that the JavaScript doesn't know the variables @user.Name and @user.Email from the foreach block.

The JavaScript block.

@section Scripts { @Scripts.Render("~/bundles/jqueryval") @Scripts.Render("~/bundles/jquery") <script> $(document).ready(function () { $("#btnTakeOver").click(function () { $("#Name").val(@user.Name); // val from inside the foreach loop $("#Email").val(@user.Email); }); }); </script> } 

Has anybody an idea how it works?

Answer 1

You can add the data into onclick event of the button:

<td> <input type="button" value="get" id="btnTakeOver" class="btn btn-primary" onclick="myFunction(@user.Name,@user.Email)" /> </td> 

js:

 <script> function myFunction(Name,Email){ $("#Name").val(Name); // val from inside the foreach loop $("#Email").val(Email); } </script>