Need to launch a Bootstrap error message modal when SSP returns no records

bbrindza

I want to launch a Bootstrap modal error message window when DataTable SSP return no records,

 function getLabelComponentInformation(){ 

     $('#componentTable').DataTable( {
                                      processing: true,
                                      serverSide: true,
                                      ajax: 'ssp_My PHPScript.php',  
                                      order: [[ 3,'asc']],
                                      pageLength: 5,
                                      lengthMenu: [[5, 10, 15, 25, 50, -1], [5, 10, 15, 25, 50, "All"]],
                                      columns: [
                                                  { data: 'inactiveCode' },
                                                  { data: 'itemNumber' },
                                                  { data: 'itemDescription' },
                                                  { data: 'itemPercent'},
                                                  { data: 'nutrionalDescription',  },  
                                                ],
                                      
                                    fixedHeader: true,
          });//END .dataTable
}
</script> 

<div id="noLabelComponentInformationModal" class="modal fade" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h6 class="modal-title">Error</h6>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <h6>No Label Component Information Found for Keyword Search</h6><br>
        <h6>"<span id="noLabelComponentInformationModalSpanKeywordSearch"></span>"</h6>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

kthorngren

One option is to use drawCallback. The second example is close to what you want. Instead of using data() you would use count(), for example:
console.log( api.rows( {page:'current'} ).count() );

If the count() is 0 then display your message.

Kevin