如何在点击取消按钮时获取克隆html隐藏ID

时间:2014-09-10 13:00:35

标签: jquery

我在这里有克隆html数据我需要删除一条记录然后我需要从该取消记录中获取id。  这是我的HTML代码:

   <div id="Allergies" class="clone">
        <div class="copy">
            <input type="hidden" id="allergyId" value="">
         /*rest of the code will be the html data*/
      <a class="addallergy" id="addallergy">Save and Add Allergy</a>
      <a class="removeallergy" id="removeallergy">Cancel</a>
        </div>
    <div>

这是我的javascript代码:

 var p=$('.copy').length;
  var h=0;
        for(var i=0 ; i<data.allergies.length ; i++){
          var cloned = $(".copy:first").clone(true)
              .     .appendTo('#Allergies').addClass("childAllergyClass" + (i + 1));
            $(".childAllergyClass"+ ++h+" #allergyId").val(data.allergies[i].allergyId);
     }

现在我的HTML代码将是:

 <div id="Allergies" class="clone">
        <div class="copy childAllergyClass1">
            <input type="hidden" id="allergyId" value="123">
         /*rest of the code will be the html data*/
           <a class="addallergy" id="addallergy">Save and Add Allergy</a>
           <a class="removeallergy" id="removeallergy">Cancel</a>            
       </div>
        <div class="copy childAllergyClass2">
            <input type="hidden" id="allergyId" value="124">
         /*rest of the code will be the html data*/
            <a class="addallergy" id="addallergy">Save and Add Allergy</a>
            <a class="removeallergy" id="removeallergy">Cancel</a>    
       </div>
    <div>

如果长度为2则在UI中显示两个过敏症。如果我点击取消,当前记录将通过使用代码消失

    $(".removeallergy").click(function(e) {
         $(this).closest(".copy").fadeOut("slow", function(){
            $(this).remove();
          });
    });

然后我需要特定的记录ID来激活数据库中的当前记录状态。

请帮助我如何从取消记录中获取ID,或者更好的想法是在数据库中激活记录。

2 个答案:

答案 0 :(得分:0)

我得到了一个答案:在我的项目中,我使用类似的ID,我的应用程序运行正常。

$(".removeallergy").click(function(e) {
     $(this).closest(".copy").fadeOut("slow", function(){
        var abc = $("#allergyId",this).val();
           $(this).remove();
      });
}); 

答案 1 :(得分:0)

此处我使用类似的ID并成功获取数据。请查看以下代码

<div>
     <div class="duplicate1">
        Name1:<input type="text"  name="duplicateName" id="duplicateName"/>
        Id1:<input type="text" name="duplicateId" id="duplicateId"/>
     </div>
      <div class="duplicate2">
         Name2:<input type="text" name="duplicateName" id="duplicateName"/>
         Id2:<input type="text"  name="duplicateId" id="duplicateId"/>
      </div>
     <button type="button" onclick="javascript:saveDuplicates();">Save</button>
</div>

这是java脚本代码:

function saveDuplicates(){
        var duplicate = {
                duplicateName1 : $(".duplicate1 #duplicateName").val(),
                duplicateId1 :  $(".duplicate1 #duplicateId").val(),
                duplicateName2 :  $(".duplicate2 #duplicateName").val(),
                duplicateId2 :  $(".duplicate2 #duplicateId").val()
        };
        var jsonString = JSON.stringify(duplicate);
        alert(jsonString);
    }