将ID链接到按钮

时间:2016-05-19 13:05:49

标签: asp.net asp.net-mvc database razor

我的foreach循环数据库中的所有人(2个人),但是当我点击' Wijzig'按钮它始终显示第一个人的数据。有没有办法将它链接到它所在的同一行?

这是我的观点,第一行是我和我的详细信息。第二个是朋友和他的细节。

当您点击按钮' Wijzig'它会显示下面这个表单的弹出窗口。我把这些信息模糊了,但是它显示了我在' Wijzig'纽扣。如何将按钮链接到该行中的人?我是否必须在模型或foreach循环中更改某些内容?

我的观点(我认为这是您需要的所有代码):

 @if (Model.Bestuur.Bestuursleden.Any())
                {
                    foreach (var i in Model.Bestuur.Bestuursleden)
                    {
                        <tr>
                            <td width="100">
                                <div id="flip"><img src="https://cdn2.iconfinder.com/data/icons/finance-vol-2-2/128/finance-56-128.png" class="circular" width="100px" height="100px">
                            <td width="350px">
                                <label for="persoon" style="width: 400px;">@i.Persoon.Voornaam @i.Persoon.Achternaam</label><p>Email: @i.Persoon.Email <br>Woonplaats: @i.Persoon.Woonplaats<br>Telefoonnummer: @i.Persoon.Telnr)</p>

                                <div id = "panel" style = "display: none;" >
                                    Meer informatie: @i.Persoon.Informatie
                                </div>
                            </td>
            </div>


            <td>
                <label for= "persoon"> @i.Funktie.Naam </label>


             </td>


            <td style="border-color: transparent;">
    <button type="submit" class="btn btn-primary" data-toggle="modal" data-target="#myModalNorm" name="id" style="background-color: #42a5f5; border-color: #42a5f5; margin-left: 20px;">Wijzig</button>

请帮帮我

1 个答案:

答案 0 :(得分:0)

我通常通过使用按钮类型并为其提供数据属性来存储Id来实现此目的。 E.g

<button type="button" data-id="@i.Id.ToString()" class="btn btn-primary" data-toggle="modal" data-target="#myModalNorm" name="id" style="background-color: #42a5f5; border-color: #42a5f5; margin-left: 20px;">Wijzig</button>

然后使用jQuery处理被单击的按钮。使用.attr(“data-id”)方法解析ID,并使用ajax调用服务器。

$('.btn-primary').click(function(e) {
    e.preventDefault();

    var id=$(this).attr("data-id");

    //use ajax to query the data for this Id

    //Bind to form

    //Show modal
});

完成后,您可以绑定到模态窗体并显示模态。