title: How to make DataTable draw new results?
body: <p>I have a problem with drawing new data into my table using <code>DataTable</code> plugin. I have table that show recepients of notification called <code>#recipientsTable</code> that is stored inside one modal. Now, whenever modal is opened it should show different recipients whose data I'm getting as a response from server. So this is how it looks: 
  <a href="https://i.stack.imgur.com/e8fwz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/e8fwz.png" alt="enter image description here"></a> </p>
  
  <p>When you click on message of this marked notification this modal in witch table with users is stored is shown.
  <a href="https://i.stack.imgur.com/h7GtL.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/h7GtL.png" alt="enter image description here"></a></p>
  
  <p>As you can see it is a DataTable table and here is how I made it:</p>
  
  <pre><code>function showNotificationRecipients(app_id) {
     var data = {};
  
     $('#myModal').modal('toggle');
     data.notificationId = notification_id;
     data.appId = app_id;
     data.fields = customFields;
     var table = $("#recipientsTable").DataTable({
         "retrieve": true,
         "StateSave": true,
         "PaginationType": "full_numbers",
         "bPaginate": true,
         "bLengthChange": true,
         "bFilter": true,
         "bSort": false,
         "bInfo": true,
         "bAutoWidth": false,
         "bProcessing": true,
         "orderClasses": false,
         "processing": true,
         "serverSide": true,
         "ajax": {
              url: "showRecipients.php",
              type: "POST",
              dataType: "JSON",
              data: data                            
         }
     });
     table.on( 'xhr', function ( e, settings, json ) {
           console.log( 'Ajax event occurred. Returned data: ', json );
      } );
  }
  </code></pre>
  
  <p>So this function opens modal and initalises DataTable. So when I click first time after page is being loaded on any notification and request to see it's recipients, it shows me correct ones, but when I request to see recipients of other notification, same users are shown as from first draw and in my Network browser's tool I see that no new request to showRecipients.php has been sent. I tried various things like:</p>
  
  <pre><code>    if ( $.fn.dataTable.isDataTable( '#recipientsTable' ) ) {
          var table = $("#recipientsTable").DataTable({
               "ajax": {
               url: "showRecipients.php",
               type: "POST",
               dataType: "JSON",
               data: data
           }
  })
  }else {
         var table = $("#recipientsTable").DataTable({
                    "retrieve": true,
                    "StateSave": true,
                    "PaginationType": "full_numbers",
                    "bPaginate": true,
                     "bLengthChange": true,
                     "bFilter": true,
                     "bSort": false,
                     "bInfo": true,
                     "bAutoWidth": false,
                     "bProcessing": true,
                     "orderClasses": false,
                     "processing": true,
                     "serverSide": true,
                     "ajax": {
                           url: "showRecipients.php",
                           type: "POST",
                           dataType: "JSON",
                           data: data
                     }
              });
    }
  </code></pre>
  
  <p>Also:</p>
  
  <pre><code>if ( $.fn.dataTable.isDataTable( '#recipientsTable' ) ) {
           "retrieve": true,
           "StateSave": true,
           "PaginationType": "full_numbers",
           "bPaginate": true,
           "bLengthChange": true,
           "bFilter": true,
           "bSort": false,
           "bInfo": true,
           "bAutoWidth": false,
           "bProcessing": true,
           "orderClasses": false,
           "processing": true,
           "serverSide": true,
           "ajax": {
                url: "showRecipients.php",
                type: "POST",
                dataType: "JSON",
                data: data
           }
       });
      })
     }
      else {
          var table = $("#recipientsTable").DataTable({
                      "retrieve": true,
                      "StateSave": true,
                       "PaginationType": "full_numbers",
                       "bPaginate": true,
                       "bLengthChange": true,
                       "bFilter": true,
                       "bSort": false,
                       "bInfo": true,
                       "bAutoWidth": false,
                       "bProcessing": true,
                       "orderClasses": false,
                       "processing": true,
                       "serverSide": true,
                       "ajax": {
                            url: "showRecipients.php",
                            type: "POST",
                            dataType: "JSON",
                            data: data
                       }
              });
      }
  </code></pre>
  
  <p>And this:</p>
  
  <pre><code>table.on( 'draw', function () {
         var json = table.ajax.reload();
   } );
  </code></pre>
  
  <p>But with no success. Does anyone has any idea how I could make this work as it should?</p>