JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/scroller/1.4.2/css/scroller.dataTables.min.css">
<script src="https://cdn.datatables.net/scroller/1.4.2/js/dataTables.scroller.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/select/1.2.1/css/select.dataTables.min.css">
<script src="https://cdn.datatables.net/select/1.2.1/js/dataTables.select.min.js"></script>
<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>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<table id="table1">
  <thead>
    <tr>
      <th>Action</th>
      <th>Tgl. Nota</th>
      <th>No. Nota</th>
      <th>Supplier</th>
      <th>Tgl. Terima</th>
      <th>Hrg. Total Nota</th>
    </tr>
  </thead>
  <tbody></tbody>
</table>

JavaScript

var table = '';
$(document).ready(function() {
  table = $('#table1').DataTable({
    serverSide: true,
    ordering: false,
    searching: false,
    //select: true,
    ajax: function ( data, callback, settings ) {
      var out = [];

      for ( var i=data.start, ien=data.start+data.length ; i<ien ; i++ ) {
        out.push( [ 'edit' ,i+'-1', i+'-2', i+'-3', i+'-4', i+'-5' ] );
      }

      setTimeout( function () {
        callback( {
          draw: data.draw,
          data: out,
          recordsTotal: 5000000,
          recordsFiltered: 5000000
        } );
      }, 50 );
    },
    scrollY: 220,
    scroller: {
      loadingIndicator: true
    },
    columns:[
      {
      	"data" : 0,
        render: function(data, type, row) {
        	return "<div class='btn btn-xs btn-warning' data-toggle='tooltip' data-placement='bottom' title='Update' onclick='update()'><i class='fa fa-pencil'></i></div>"
        }
      },
      {
      	"data" : 1
      },
      {
      	"data" : 2
      },
      {
      	"data" : 3
      },
      {
      	"data" : 4
      },
      {
      	"data" : 5
      },
    ]
  });
});

function update() {
    //please look on your console tab while inspecting element
    //click on action button
    //if object[0] array length is 1 then it can be scrolled to
    //otherwiser it cant be scrolled to
    //it is happen because the index i want to be scrolled to is on page 2
    //any solution? thankyou
    console.log(table.row(40).scrollTo()); //this code can be done
    //console.log(table.row(100).scrollTo()); //this code can't be done coz its on page 2
}