Stuck in processing and Uncaught TypeError: Cannot read property 'display' of undefined

Dante_0379

I am using the following js and css

CSS
1. dataTables.bootstrap.min.css
2. responsive.bootstrap.min.css

JS
1. jquery.dataTables.min.js
2. dataTables.bootstrap.min.js
3. responsive.bootstrap.min.js
4. dataTables.responsive.min.js

$('#dataTable').DataTable( {
            "responsive": true,
            "autoWidth": false,
            "processing":true,
            "serverSide":true,
            "destroy": true,
            "ajax" :{
                 "url": url,
                 "type": "POST"
            },
            "pagingType":pagingType,
            "pageLength": 10,
            "lengthMenu":[ [10, 25, 50, 100], [10, 25, 50,100] ],
            "paging":true,
            "searching":false,
            "ordering":false,
            "language": {
        "emptyTable": "No records available"
    },
            "columns": [
                             { "data": null,
                                "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                                    $(nTd).html('<a href="#" id = "edit_\''+oData.id+'\'" >Edit</a>');
                                    
                                }
                            },
                            { "data": "prop1",
                               "defaultContent": "",
                              },
                            { "data": "prop2" ,
                              "defaultContent": "" 
                              }, 
                            { "data": "prop3",
                                "defaultContent": "" 
                                },
                            { "data": "prop4",
                            "defaultContent": ""    
                            },
                            { "data": "prop5",
                              "defaultContent": ""
                              },
                            { "data": "prop6",
                              "defaultContent": "",
                              "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                                    if(null!=oData.prop6 && "A"==oData.prop6)
                                        {
                                            $(nTd).html("Active");
                                        }   
                                    else if(null!=oData.state && "I"==oData.state)
                                        {
                                            $(nTd).html("Inactive");    
                                        }
                                    else
                                        {
                                            $(nTd).html("");
                                        }   
                                     }
                            }
                        ];
        } );

I've used datatables in almost 25-30 of my JSP and everything works fine except these two problems in every page.

1. Getting a javascript error " Uncaught TypeError: Cannot read property 'display' of undefined --- responsive.bootstrap.min.js:5 " in every page, which seems to have no impact on the functionality, It is just that I don't like JS errors.

2. I don't know why it gets stuck in processing when no data comes fromt the server. It should display 'No records available' instead.

Dante_0379

I really need help with this.. I've already tried what I could find on the web and Datatables website and have wasted a lot of time figuring out the solution.

Is there no one in this forum who can help me out with the solution, as you can see all the data is available above. Pleas help me out.

Dante_0379

Tried and drained and have left it. At least it is not causing any problem in the execution. But, please any of the admins get a look on this. Please provide he resolution. It is always good to have error free code.

Thanks in advance

allan

Thanks for your question - however, per the forum rules can you link to a test case showing the issue please. This will allow the issue to be debugged and a resolution found.

Information on how to create a test page, if you can't provide a link to your own page can be found here.

Thanks,
Allan

ivantcholakov

@Dante_0379

3 - responsive.bootstrap.min.js
4 - dataTables.responsive.min.js

I guess you need to reorder loading of these scripts.