title: Undefined is not a function with dataTable.js
body: <p>I have the following javascript code (JQuery and datatable) which gives the error Uncaught Type error: undefined is not a function.</p>
  
  <blockquote>
    <p>function checkTransaction(tableName, url, columns){</p>
  
  <pre><code>var columnList = [];
  for (var i = 0; i &lt; columns.length; i++){
      columnList.push({
          "data": columns[i]
      });
  }
  
  for (var i = 0; i &lt; 1; i++){
      columnList.push({
          "data": "id"
      });
  }
  
  $(document).ready(function(){
      var firstname = $("#firstname").val();
      var lastname = $("#lastname").val();
      var startDate = $("#startdate").val();
      var endDate = $("#enddate").val();
      searchTable = $(tableName).dataTable({
          "ordering": false,
          "columns": columnList,
          "columnDefs": [
              {
                  "targets": columns.length,
                }
          ],
          "pagingType": "full_numbers",
          "ajax": {
              "url": url,
              type: "POST",
              data: {firstname: firstname, lastname: lastname, startDate: startDate, endDate: endDate},
              "dataSrc": "",
              error: function(xhr, error) {
                  if (xhr.status == 400) {
                      alert('Bad Request. [400]');
                  }
                  else if (xhr.status == 401) {
                      alert('User Unauthorized To Access Resource. [401]');
                  }
                  else if (xhr.status == 403) {
                      alert('Access To Resource Forbidden [403]');
                  }
                  else if (xhr.status == 404) {
                      alert('Requested Resource Not Found [404].');
                  } else if (xhr.status == 500) {
                      alert('Internal Server Error [500].');
                  }
                  else if (xhr.status == 503) {
                      alert('Service Unavailable [503].');
                  }
                  else if (error === 'parsererror') {
                      alert('Requested JSON parsing failed.');
                  }
                  else if (error === 'timeout') {
                      alert('Time out error.');
                  }
                  else if (error === 'abort') {
                      alert('Ajax request aborted.');
                  }
                  else {
                      alert('Uncaught Error.\n' + xhr.responseText);
                  }
              },
          }
      });
  
  }); }
  </code></pre>
  </blockquote>
  
  <p>Chrome points to this "searchTable = $(tableName).dataTable({" as the source of the error
  and but it looks ok to me (i have limited knowledge of Javascript)
  I'd appreciate it if someone can explain why the cause of this error.</p>
  
  <p>PS: I've made sure jquery is first loaded and only one jquery library is loaded, i've made sure that the datatable library is also load.
  Thanks.</p>