title: Show button when dataTable rows reduce to one on searching the dataTable
body: <p>I'm using a jQuery dataTable to list a group of members. When the table is searched for a member, and when the dataTable rows reduce to only that member, I want a button to appear, else the button should remain hidden.</p>
  
  <p>I can't find a way to link an even handler to this. Please help me with a solution.</p>
  
  <pre><code>&lt;script&gt;
      $(function() {
          $('#addButton').hide();
      });
  &lt;/script&gt;
  
  &lt;script&gt;
      $('#example4_filter input').keydown(function() {
          if ($('#example4 &gt; tr').length == 1) {
              $('#addButton').show();
          } else {
              $('#addButton').hide();
          }
      });
  &lt;/script&gt;
  
  &lt;table id="example4" class="display table table-bordered table-striped" width="100%" cellspacing="0"&gt;
              &lt;col width='110'&gt;
              &lt;col width='auto'&gt;
              &lt;col width='120'&gt;
              &lt;thead height='35'&gt;
                  &lt;tr&gt;
                      &lt;th&gt;Code&lt;/th&gt;
                      &lt;th&gt;Member Name&lt;/th&gt;
                      &lt;th&gt;NIC&lt;/th&gt;
                      &lt;th&gt; &lt;p id='addButton'&gt; &lt;a href="{{ url('') }}" class="btn btn-success btn-xs"&gt; &lt;span class="glyphicon glyphicon-check"&gt;&lt;/span&gt; &lt;strong&gt; &amp;nbsp Select &lt;/strong&gt; &lt;/a&gt; &lt;/p&gt; &lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
  
              &lt;tbody&gt;
                  @foreach ($memberDetails as $memberDetail)
                  &lt;tr&gt;
                      &lt;td data-search="Tiger Nixon"&gt; {!! $memberDetail-&gt;id !!} &lt;/td&gt;
                      &lt;td&gt; {!! $memberDetail-&gt;firstName.' '.$memberDetail-&gt;lastName !!} &lt;/td&gt;
                      &lt;td&gt; {!! $memberDetail-&gt;nic !!} &lt;/td&gt;
                      &lt;td&gt; &lt;/td&gt;
                  &lt;/tr&gt;
                  @endforeach
              &lt;/tbody&gt;
          &lt;/table&gt;
  </code></pre>
  
  <p>this is the inspect element code for the search of dataTable...</p>
  
  <pre><code>&lt;div id="example4_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer"&gt;
  
      &lt;div class="row"&gt;
          ::before
          &lt;div class="col-sm-6"&gt;&lt;/div&gt;
          &lt;div class="col-sm-6"&gt;
              &lt;div id="example4_filter" class="dataTables_filter"&gt;
                  &lt;label&gt;
  
                      Search:
  
                      &lt;input class="form-control input-sm" type="search" placeholder="" aria-controls="example4"&gt;&lt;/input&gt;
  
                  &lt;/label&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          ::after
  
      &lt;/div&gt;
  
  $('#example4').DataTable({
                  "paging": true,
                  "lengthChange": false,
                  "searching": true,
                  "ordering": false,
                  "info": false,
                  "autoWidth": false,
                  "lengthMenu": [[5], [5]]
              });
  </code></pre>