代码之家 › 专栏 › 技术社区 › Pawan

如何查找用户执行的操作

jquery

Pawan · 技术社区 · 7 年前

我有一个表,用户可以在其中添加或删除行

单击“保存”按钮时,是否可以知道已执行了哪些操作(如果是“添加行”或“删除行”??)

var isnewrowadded ;
    var isrowdeleted ;

    jQuery(document).ready(function() {
        var id = 0;
      jQuery("#addrow").click(function() {
        id++;           
        var row = jQuery('.samplerow tr').clone(true);
        row.find("input:text").val("");
        row.attr('id',id); 
        row.appendTo('#dynamicTable1');   
        isnewrowadded = true;
        return false;
    });        

  $('.remove').on("click", function() {
  $(this).parents("tr").remove();
  isrowdeleted =  true;
});

  $(document).on("click","#btnSave",function() {

       if(isnewrowadded)
       {
       alert('new row added');
       }
       else if(isrowdeleted)
       {
        alert(' row deleted');
       }

    });

});

https://jsfiddle.net/qvtL6qf2/398/

你能告诉我怎么解决这个问题吗?

1 回复 | 直到 7 年前

Rumesh 7 年前

我改变了以前的回答。现在,我添加了一个隐藏的输入,并在单击“添加行”和“删除”时更改了其值。然后当您单击保存按钮时,最后一条操作消息将被提醒。检查下面的代码。

var isnewrowadded;
var isrowdeleted;

jQuery(document).ready(function() {
  var id = 0;
  jQuery("#addrow").click(function() {
    id++;
    var row = jQuery('.samplerow tr').clone(true);
    row.find("input:text").val("");
    row.attr('id', id);
    row.appendTo('#dynamicTable1');


    $('#change-status').val('New Row Added'); //assign new row message to status

    return false;
  });

  $('.remove').on("click", function() {
    $(this).parents("tr").remove();
    $('#change-status').val('Row Deleted'); //assign delete row message to status

  });

  $(document).on("click", "#btnSave", function() {
    alert($('#change-status').val()); //just alert hidden input value
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btnSave">Save</button>
<table id="dynamicTable1">
  <thead>
    <th>Id</th>
    <th>Name</th>
    <th>Age</th>
    <th>Place</th>
    <th>Skill</th>
  </thead>
  <tbody class="row-cont">
    <tr id="0">
      <td><input type="text" id="fld1" /></td>
      <td><input type="text" id="fld2" /></td>
      <td><input type="text" id="fld3" /></td>
      <td><input type="text" id="fld4" /></td>
      <td><input type="text" id="fld5" /></td>
      <td><button class="remove">Remove</button></td>
    </tr>
  </tbody>
</table>

<input type="button" id="addrow" value="Add New Row" />

<table class="samplerow" style="display:none">
  <tr>
    <td><input type="text" id="fld1" /></td>
    <td><input type="text" id="fld2" /></td>
    <td><input type="text" id="fld3" /></td>
    <td><input type="text" id="fld4" /></td>
    <td><input type="text" id="fld5" /></td>
    <td><button class="remove">Remove</button></td>
  </tr>
</table>
<!-- NEW HIDDEN INPUT -->
<input type="hidden" id="change-status" value="No Change">