DataTables remove row button

Question

I am trying to have my script delete the row completely once the "locatebutton" has been pressed. I have the following code however I cannot seem to get it working right. Yes, the table name within DataTables is named "dataTables-example".

Button:

<td><button type="button" name="locateButton1" class="btn btn-info" onClick="UpdateLocate(<?php echo $orow['wo']; ?>);"/>Locates</button></a></td>

Script:

<script>
function UpdateLocate(wo)
    {
            jQuery.ajax({
            type: "POST",
            url: "functions/markLocates.php",
            data: 'wo='+wo,
            cache: false,
            success: function(response)
        {
                //alert("Record successfully updated");

                    $('#dataTables-example').on( 'click', 'a.editor_remove', function (e) {
    e.preventDefault();

    editor
        .title( 'Edit record' )
        .message( "Are you sure you wish to delete this row?" )
        .buttons( { "button": "locateButton1", "fn": function () { editor.submit() } } )
        .remove( $(this).closest('tr') );
} );
        }
                    });
    }

Answer 1

I was able to accomplish this with the following

$("#dataTables-example").on('click', '.btn-info', function () {
        $(this).parent().parent().remove();
    });

Answer 2

Try this one. this is working example

   <table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Name</th>
                        <th>Position</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>1</td>
                        <td>Tiger Nixon</td>
                        <td>System Architect</td>
                        <td><button>Delete</button></td>
                    </tr>
                </tbody>
            </table>

    <script>
      $(document).ready(function () {
         var table = $('#example').DataTable({
            "columns": [
              null, 
              null,
              null,
              {
                "sortable": false
              }
            ]
          });          
      });
      $('#example').on("click", "button", function(){
            console.log($(this).parent());
            table.row($(this).parents('tr')).remove().draw(false);
      });
    </script>