JavaScript Passing Parameters to modal ASP.NET Core

Question

I have problem with my modal boostrap seems like not passing parameter to modal. Here is my code:

My view:

@foreach (var item in Model)
{
    <tr>
        <td>@Html.DisplayFor(modelItem => item.EmployeeId)</td>
        <td>@Html.DisplayFor(modelItem => item.Fname)  @Html.DisplayFor(modelItem => item.Lname)</td>
        <td>@Html.DisplayFor(modelItem => item.PhoneNumber)</td>
        <td>@Html.DisplayFor(modelItem => item.Position)</td>
        <td>
            <a asp-action="Edit" asp-route-id="@item.EmployeeId">Edit</a> |
            <button type="button" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#myModal" data-emp-id="@item.EmployeeId"><span class="glyphicon glyphicon-trash" style="vertical-align:middle;margin-top: -5px"></span> Delete</button>
        </td>
    </tr>

}

My modal:

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Confirm Delete</h4>
        </div>
        <div class="modal-body">
            <p>Are you sure you want to delete invoice number:</p>
            <input type="text" name="empID" value=""/>
        </div>
        <div class="modal-footer">
            <form asp-controller="Employee" asp-action="Delete" method="post" class="form-inline" role="form">
                <input type="hidden" id="Id">
                <button type="submit" class="btn btn-danger"><span class="glyphicon glyphicon-trash" style="vertical-align:middle;margin-top: -5px"></span> Delete</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </form>
        </div>
    </div>
</div>

My JavaScript: I think the problem is somewhere in this code but I don't know why.

<script src="./javascript.js" type="text/javascript">
$("button[type='button']").click(function () {
    $("#myModal").find("input[type='text']").val($(this).attr("EmpID")); 
});

What makes it wrong with my work? Does anyone knows why is not passing the parameter to model?

I'm just a beginner and I have no idea whats going on in my codes.

Any help would be appreciated.

user61470 · Accepted Answer · 2017-03-31 11:05:36Z

3

Your button doesn't have an attribute named EmpId. However it does have an attribute named data-emp-id which I assume contains the value you want.

jQuery has a data method for accessing data attributes easily; in short you can get it using $(this).data("emp-id")

answered Mar 31, 2017 at 11:05

user61470

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

1 Comment

neophyte Over a year ago

@NightShade555 WELCOME TO SO. if this answer has helped you consider accepting and upvoting it. SO works in this way..this way this question will not attract spam answers.

Collectives™ on Stack Overflow

JavaScript Passing Parameters to modal ASP.NET Core

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related