How to scroll to selected row from filtered list on unfiltered list

How to scroll to selected row from filtered list on unfiltered list

prime_factorsprime_factors Posts: 1Questions: 1Answers: 0
<script type="text/javascript" src="auditlog.js"></script>
<script type="text/javascript" src="js/jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="DataTables/datatables.min.js"></script>
<script type="text/javascript" src="DataTables/Scroller-2.0.3/js/dataTables.scroller.min.js"></script>
<script type="text/javascript">
    var scrollPosition = 1234;   // total number of log entries
</script>  
<script type="text/javascript">
    $(document).ready(function () {
      var table = $('#example').DataTable({
        data: logdata,
        columns: [
          { data: 'date', className: 'no-wrap' },
          { data: 'msgId' },
          { data: 'type', },
          { data: 'msg' },
          { data: 'userID', "visible": false },
          { data: 'host', "visible": false },
        ],
        deferRender: true,
        scrollY: '60vh',
        scrollCollapse: true,
        scroller: true,
        initComplete: function () {
          this.api().scroller.toPosition(scrollPosition);
        },
      });

      $('#example tbody').on('click', 'tr', function () {

        // what do I do here to scroll to the selected row after search cleared? 
 
        table.search('').draw();   // this may not be correct
      });
    });
  </script> 

Description of problem: For listing log messages, we initially show all log entries sorted by date and scroll to the bottom (most recent). We want to use search to locate a log entry and then have clicking on the row clear the filter and scroll to the row we clicked on so we can review the adjacent log entries around the entry we clicked on in the filtered list. I lack jQuery expertise and haven't found any examples to do this...suggestions would be most appreciated.

Thanks

Answers

  • colincolin Posts: 12,881Questions: 0Answers: 2,198
    edited May 4

    You can use row().scrollTo(), so if you're only selecting a single row, you could do something like

    table.row({selected: true}).scrollTo();
    

    Colin

Sign In or Register to comment.