Answers

• kthorngren Posts: 21,343Questions: 26Answers: 4,954

  March 2018

  What are the results of following the troubleshooting steps in the URL provided by the error?
  http://datatables.net/tn/7

  Kevin
• istudent_learning Posts: 31Questions: 9Answers: 0

  March 2018

  This is what developer tools logged
  responsive.bootstrap4.min.js:5 Uncaught TypeError: Cannot read property 'display' of undefined
  at responsive.bootstrap4.min.js:5
  at responsive.bootstrap4.min.js:5
  at responsive.bootstrap4.min.js:5
  (anonymous) @ responsive.bootstrap4.min.js:5
  (anonymous) @ responsive.bootstrap4.min.js:5
  (anonymous) @ responsive.bootstrap4.min.js:5
• kthorngren Posts: 21,343Questions: 26Answers: 4,954

  March 2018

  The steps in the URL also have you looking at the Network Panel to see the response from the server. What is the server response?

  Kevin
• istudent_learning Posts: 31Questions: 9Answers: 0

  March 2018

  Status Code: 302 Found
• kthorngren Posts: 21,343Questions: 26Answers: 4,954

  March 2018

  Maybe you can post a link to your page for troubleshooting. If not then please provide debugger output. Post the URL generated.
  https://datatables.net/manual/tech-notes/10#DataTables-debugger

  Kevin
• istudent_learning Posts: 31Questions: 9Answers: 0

  March 2018

  I can't post the link. this is for my work. I can provide you the js and css file I have included
• kthorngren Posts: 21,343Questions: 26Answers: 4,954

  March 2018

  302 is a redirect. My understanding, per the tech note above, Datatables expects a 2xx response. The 302 is being returned by your server. You will need to look at your server scrip to determine why its returning a 302 response.

  Kevin
• istudent_learning Posts: 31Questions: 9Answers: 0

  March 2018

  <link href="~/Content/bootstrap.min.css" rel="stylesheet" />

  <link href="~/Content/DataTables/css/dataTables.bootstrap4.min.css" rel="stylesheet" />
  <link href="~/Content/DataTables/Responsive/css/responsive.dataTables.min.css" rel="stylesheet" />
  <link href="~/Content/DataTables/Responsive/css/responsive.bootstrap4.min.css" rel="stylesheet" />
  

  
  <script src="~/Scripts/DataTables/js/jquery.dataTables.min.js"></script>
  <script src="~/Scripts/DataTables/js/dataTables.bootstrap4.min.js"></script>
  <script src="~/Scripts/DataTables/Responsive/js/responsive.bootstrap4.min.js"></script>

  my javascript code is
  $(document).ready(function () {

          //var token = $('[name=__RequestVerificationToken]').val();
  
          //jQuery DataTables initialization
          var oTable = $('#myTable').DataTable({
  
              "ajax": {
                  "url": "/Home/Report/LoadReportData",
                  "type": "POST",
                  "datatype": "json",
                  "data": { "__RequestVerificationToken": token }
              },
              "columns": [
                  { "data": "Store", "name": "Store" },
                  { "data": "Form", "name": "Form" },
                  { "data": "Order", "name": "Order" },
                  { "data": "Sku", "name": "Sku" },
                  { "data": "RequestedDate", "name": "RequestedDate" },
                  { "data": "Reason", "name": "Reason" }
              ],
              "responsive": true,
              "serverSide": "true",
              "order": [0, "asc"],
              "processing": "true",
              "language": {
                  "processing": "Loading. Please wait..."
              },
              "dom": "<'row'<'col-sm-6'l><'col-sm-6'p>>" +
                  "<'row'<'col-sm-12'tr>>" +
                  "<'row'<'col-sm-4'i>>"
          });
  
  
          $('.search-input-text').on('keyup click', function () {
              var i = $(this).attr('data-column');
              var v = $(this).val().toLowerCase();
              oTable.columns(i).search(v).draw();
          });
          $('.search-input-select').on('change', function () {
              var i = $(this).attr('data-column');
              var v = $(this).val();
              oTable.columns(i).search(v).draw();
          });
  
          $(document).on('click', '.backbutton', function (e) {
              window.location = "/Home/MultiReports";
          });
  
  
      });
  
• istudent_learning Posts: 31Questions: 9Answers: 0

  March 2018

  If i do not include Token, It works fine. When i add the token i dont get data back.
• kthorngren Posts: 21,343Questions: 26Answers: 4,954

  March 2018 Answer ✓

  Again you will need to look at your server script to determine why its returning a 302. Datatables has nothing to do with the error. AJAX is sending the parameter __RequestVerificationToken with the token value to the server. The server is, for some reason, responding with the 302.

  Kevin
• istudent_learning Posts: 31Questions: 9Answers: 0

  March 2018

  var head = request.Headers.Get("__RequestVerificationToken");

  I get null value.
• allan Posts: 63,523Questions: 1Answers: 10,473 Site admin

  March 2018

  As Kevin has mentioned, you'll need to look at your server-side script. I'm afraid we can't offer support for that. You are probably best asking on StackOverflow or similar if you don't know how to read information from the HTTP request.

  I would point out that you are using request.Headers.Get but you aren't sending the verification token in the header. You are sending it in the request body.

  Allan
• istudent_learning Posts: 31Questions: 9Answers: 0

  March 2018

  Thank you for reaching out. I realized that i was not creating token to pass. It is fixed now.