I got Error while passing RequestVerification Token ?

istudent_learning

I am using Asp.net MVC 5 in back end. Whenever I pass request verification token I below error.
DataTables warning: table id=myTable - Ajax error. For more information about this error, please see http://datatables.net/tn/7

var oTable = $('#myTable').DataTable({

            "ajax": {
                "url": "/Home/Report/LoadReportData",
                "type": "POST",
                "datatype": "json",
                "data": { '__RequestVerificationToken': $('[name=__RequestVerificationToken]').val() }
            },

kthorngren

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

Kevin

istudent_learning

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

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

Status Code: 302 Found

kthorngren

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

I can't post the link. this is for my work. I can provide you the js and css file I have included

kthorngren

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

<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

If i do not include Token, It works fine. When i add the token i dont get data back.

kthorngren

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

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

I get null value.

allan

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

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