JSFiddle - React, Tailwind, and code Playground

by akshatha suchethan

HTML

<table class="table">
    <thead class="thead-inverse">
        <th>Report Name</th>
        <th>Report Discussion</th>
    </thead>
    <tbody>
        <tr id='addr0'>                         
            <td>
                <input type="text" name="name0" class="form-control" name="gdiscuss">
            </td>
            <td><textarea name="discuss0" class="form-control"></textarea></td>
              <td><a href="#" class="confirm-delete btn mini red-stripe" role="button" data-title="johnny" data-id="1">Delete</a></td>
           
        </tr>
    </tbody>
</table>
   <br>
   <input type="button" id="add_row"  value="Save & Add New Row"/>

JavaScript

$('#myModal').on('show', function() {
    var tit = $('.confirm-delete').data('title');

    $('#myModal .modal-body p').html("Desea eliminar al usuario " + '<b>' + tit +'</b>' + ' ?');
    var id = $(this).data('id'),
    removeBtn = $(this).find('.danger');
})

$('.confirm-delete').on('click', function(e) {
    e.preventDefault();

    var id = $(this).data('id');
    $('#myModal').data('id', id).modal('show');
});

$('#btnYes').click(function() {
    // handle deletion here
    var id = $('#myModal').data('id');
    $('[data-id='+id+']').parents('tr').remove();
    $('#myModal').modal('hide');
    
});