Question

我正在开发MVC应用程序。我想点击删除链接时获取记录的ID。在警报窗口中，我想显示我删除的记录ID。

怎么做？

  @model PaymentAdviceEntity.CompanyType

     <script type="text/javascript">

         $(document).ready(function () {
             $('.remove').click(function () {   
                alert(?????);         
               $(this).parent().parent().remove();   


        });          

         });

     </script>          


     <div id='InvoiceList' class='divInvoiceList span12' style='margin-bottom:5px;margin-left:0px;'>
            @if (Model != null)
       {
               <span class="span3" style="margin-left:0px;">@Html.TextBox("InvoiceId", @Model.Name , new { @onkeypress = "return isNumberKey(event)", @onblur = "CalculateNetValue()", @style = "width:75%; text-align:right;", @class = "clsInvoiceId" })</span>  

<span class="span1" style="margin-left:0px;padding-top:6px;">@Html.HiddenFor(model=>model.Id) <a href='#' style='font-size:14px;text-decoration:none;font-weight:bold;' id='lnkRemove' class='clsRemove remove'>X</a></span>

       }

    </div>

我可以看到记录ID，即data-id = 4，但在运行应用程序后无法检查下面的HTML代码。

<span class="span3" style="margin-left:0px;" data-id="4"><input class="clsInvoiceId valid" id="InvoiceId" name="InvoiceId" onblur="CalculateNetValue()" onkeypress="return isNumberKey(event)" style="width:75%; text-align:right;" type="text" value="asdasd"></span>

Answer 1

$('.remove').click(function () {  
   var $ele = $(this).parent().parent();

   var id = $ele.attr("id");

   $ele.remove();   

   alert(id);                
});

Answer 2

如果您在谈论模型中的ID属性，那么您只需将其添加到跨度内的隐藏字段中

<span class="span1" style="margin-left:0px;padding-top:6px;">@Html.HiddenFor(model=>model.ID) <a href='#' style='font-size:14px;text-decoration:none;font-weight:bold;' id='lnkRemove' class='clsRemove remove'>X</a></span>

并在客户端访问它，如

 $(document).ready(function () {
         $('.remove').click(function () {
           var id = $(this).closest("input").val();   
           $(this).parent().parent().remove();   

           alert(id);                
    });

修改

如果正在制作以下HTML

<span class="span3" style="margin-left:0px;" data-id="4"><input class="clsInvoiceId valid" id="InvoiceId" name="InvoiceId" onblur="CalculateNetValue()" onkeypress="return isNumberKey(event)" style="width:75%; text-align:right;" type="text" value="asdasd"></span>

然后，您应该使用以下jQuery代码

$('.remove').click(function () {
    var id = $(this).parent().prev().attr("data-id");
    $(this).parent().parent().remove();
    alert(id);
});

您可以看到它有效here

Answer 3

$('.remove').click(function () {
     var removedId = $(this).closest('.clsInvoiceId').val();
     $(this).parent().parent().remove();   
     alert(removedId); 
}

Answer 4

<强>更新

如果您的HTML看起来像这样，

    <span class="span3" style="margin-left:0px;" data-id="4">
        <input class="clsInvoiceId valid" id="InvoiceId" name="InvoiceId" onblur="CalculateNetValue()" onkeypress="return isNumberKey(event)" style="width:75%; text-align:right;" type="text" value="asdasd">
    </span>
    <span class="span1" style="margin-left:0px;padding-top:6px;"> 
        <a href='#' style='font-size:14px;text-decoration:none;font-weight:bold;' id='lnkRemove' class='clsRemove remove'>X</a>
    </span>

然后，当您点击该链接时，应该获得data-id

$('.remove').live("click", function () {     
     var removedId = $(this).parent().prev().attr("data-id");
     $(this).parent().parent().remove();  
     alert(removedId);
});

Answer 5

您必须将ID放在HTML标记的某处，因为一旦进入客户端，您就无法再访问该模型了。

基本上，您可以使用新的data- HTML5属性：

<span class="span1" data-id="@Model.ID"> <-- this is the important bit
  <a href='#' id='lnkRemove' class='clsRemove remove'>X</a>
</span>

然后：

 $(document).ready(function () {
     $('.remove').click(function () {   
       alert($(this).parent().data("id")); // here we read the data-id...
       $(this).parent().parent().remove();   
     });          
 });

如何在MVC中使用Jquery获取Id？

5 个答案: