title: How to enable Show entries with Filter columns using RestAPI Ajax call from Sharepointlist with jquerydataTable?
body: <p>I want to show all <em>retrieving data</em> into <strong>sharepointsite page</strong>. So that, 
      I had used jquery dataTable for retrieving data from sharepoint list to show current html page. Html <strong>content code</strong> used in <strong>sharepoint ContentEditor</strong> and also <strong>'Script code'</strong> used in <strong>ScriptEditor of sharepoint site page</strong>.<br>
      But i can't show <em>Show entries</em> content and <em>Filter content</em> . I can't enable to these features of <strong>jqueryDataTable</strong>. 
      Can anyone help to me..?</p>
  
  <pre><code>**ContentEditor** 
  
  Html content is,
  
  &lt;div class="container"&gt;
      &lt;table id="demoexample"&gt;&lt;/table&gt;
  &lt;/div&gt;
  
  
  **ScriptEditor**
  
  Script code is,
  
  
  &lt;style type = "text/css"&gt;
  .container {
  
  }
  &lt;/style&gt;
  
  &lt;script src="https://code.jquery.com/jquery-1.11.2.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"&gt;&lt;/script&gt;
  &lt;script src = "https://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css"&gt;&lt;/script&gt;
  &lt;script&gt;
      $(document).ready(function () {
  
          setTimeout(function () { retrieveListItems(); }, 2000);
  
  
      });
  
      var SPListData="";
      var Botanic = [];
      var BotanicAll = [];
                  /* Some script code*/
  
          function retrieveListItems() 
              {
                  //console.log("I am in retrieveListItems() ");
                  var collListItem = "";
                  //var clientContext = new SP.ClientContext('http://www.vignesh.cloudappsportal.com');
                  getListItem('siteUrl', 'Catalogue', 'field1','field2','field3',.....,'onQuerySucceeded', 'onQueryFailed');
              }
  
  
          function getListItem(url, listname, field1,field2,field3,....., complete, failure) 
              {
  
  
                  // Getting our list items
                  $.ajax({
                      url: url + "/_api/lists/getbytitle('"+ listname +"')/items",
                      method: "GET",
                      headers: { "Accept": "application/json; odata=verbose" },
                      success: function (data) 
                      {
  
                          SPListData=data;
  
  
                          for (emp = 0; emp &lt; SPListData.d.results.length; emp++) 
                              {
  
                                  Botanic.push(new BotanicalDetails(SPListData.d.results[emp].ContentTypeId,SPListData.d.results[emp].field1,SPListData.d.results[emp].field2,SPListData.d.results[emp].field3,SPListData.d.results[emp].field4,........));
  
  
                              }
  
  
                        //Data from an Array
  
  
                          $("#demoexample").dataTable({
                            "pagingType": "full_numbers",
  
  
                              "bPaginate": false,
                              "bLengthChange": false,
                              "bFilter": true,
                              "bInfo": false,
                              "bAutoWidth": false ,
  
                              "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
  
  
                             "aaData":"currentListName",
                             "bJQueryUI": true,
                             "aoColumns": [{
                              "sTitle": "Field1",
                              "sWidth": "200px"
                            },{
                              "sTitle":"Field2",
                              "sWidth": "200px"
                            },{
                              "sTitle":"Field3",
                              "sWidth": "200px"
                            },{
                              "sTitle":"Field4",
                              "sWidth": "200px"
                            }]
                          });
  
  
  
                      },
                      error: function (data) 
                          {
                          //console.log("I am in error block of ajax call");
                              failure(data);
                          }
                  });
              };
  
          function onQuerySucceeded(_parameter) 
              {
                  //console.log("I am in onQuerySucceeded()");
                  SPListItems.push(_parameter);
              }
  
          function onQueryFailed(faildata) 
              {
                  //console.log("I am in onQueryFailed()");
                  alert('fail');
              }
          function complete(data) 
              {
                  //console.log("I am in complete");
                  SPListItems.push(_parameter);
  
              };
          function failure(data) 
              {
                  alert("S");
              };
          function Get2DisplayItems()
              {
                  for(var z=0;z&lt;=Botanic.length;z++)
                      {
                          //console.log("Now Botanic[z] value is : ",Botanic[z]);
                      }
              };
  
  
  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>I want to display retrieving data into jQuery DataTable with show entries and columnFilter content. now, i can retrieving data from sharepointlist to showing current site page successfully.</p>
  
  <p>Please anyone suggest me how to enable <strong>show entries</strong> content and <strong>column Filter</strong>.</p>