JSFiddle - React, Tailwind, and code Playground

by Semih Muyaoğlu

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="col-md-2">
<button type="button" id="ekle" class="btn btn-success">Satır Ekle</button>
<button type="button" id="kaydet" class="btn btn-warning">Kaydet</button>
</div>



<div class="col-md-10">
  <table id="ffProposalTable" class="table">
<thead>
  <tr><th>#</th><th>değer</th><th style="width:5%;"></th></tr>
</thead>
  <tbody>
    <tr id="tr1" data-rowid="1">
      <td>1</td>
      <td><input type="text" id="satir1" class="form-control satir" data-id="1" value="1"/></td>
      <td><a href="#" class="btn btn-alert sil" data-id="1">X</a></td>
      </tr>
      
       <tr id="tr2" data-rowid="2">
      <td>2</td>
      <td><input type="text" id="satir2" class="form-control satir" data-id="2" value="2"/></td>
      <td><a href="#" class="btn btn-alert sil" data-id="2">X</a></td>
      </tr>
      
      
  </tbody>
</table>
  
</div>

JavaScript

$('#ekle').click(function () {
 //var rows = document.getElementById(myTable).getElementsByTagName("tr").length;
 	var rowCount = ($("#ffProposalTable > tbody > tr").length)+1;
	var id = $('#ffProposalTable tbody tr:last').attr('id');
  $('#ffProposalTable tbody').append($("#ffProposalTable tbody tr:last").clone());
  var last = parseInt($('#ffProposalTable tbody tr:last').attr('data-rowid'));
  var hesap = last+1;
  $('#ffProposalTable tbody tr:last input').attr('value', '');
  $('#ffProposalTable tbody tr:last').attr('id', 'tr'+ hesap +'');
  $('#ffProposalTable tbody tr:last').attr('data-rowid', ''+ hesap +'');
  $('#ffProposalTable tbody tr:last .sil').attr('data-id', ''+ hesap +'');
  $('#ffProposalTable tbody tr:last td:first').html(hesap);


});

$(document).on('click', '.sil', function(){ 
     	var silinecek = $(this).data("id");
      $('#tr'+silinecek+'').remove();
}); 

 





 $('#kaydet').click(function () {
 
 $("#ffProposalTable tbody tr").each(function() {
        //map[$(this).attr("name")] = $(this).val();
        alert("say");
    });
 });