Error datable id=example can't reinitialize data table?

Question

1.00/5 (1 vote)

See more:

I work on razor page asp.net core . I face error Datable id=example can't reinitialize data table ?

so How to solve this error please ?

error happen when change select option printer server

I need when change select on select option printer server then hide or remove table with pagination option first ,next,previous,last etc

What I have tried:

<script type="text/javascript">
        $(document).ready(function () {
     
            
           
        
            $('#PrintServer-select').change(function () {
                var printserverId = $(this).val();
               
                if (printserverId) {
                    console.log(printserverId);
                    $.ajax({
         
                        url: '?handler=RelatedBranches',
                        type: "GET",
                        dataType: "json",

                        data: { printserverId: printserverId },
                        success: function (data) {
                            console.log(data);
                            $('#branch-select').empty();
                            $.each(data, function (i, item) {
                                //console.log(item);
                                $('#branch-select').append($('<option>', {
                                    
                                    value: item.branchId,
                                    text: item.vBranchDesc
                                    
                                    
                                }));
                            });
                   
                            var tableShows = $('#example').DataTable({
                                paging: false
                            });

                            // Hide the table using jQuery
                            $('#example').hide();
                  
                            $('#example').DataTable();
                            if ($.fn.dataTable.isDataTable('#example')) {
                                $('#example').destory();
                                // The DataTables instance is already initialized
                            } else {
                                // Initialize the DataTables plugin
                                $('#example').DataTable();
                            }
                        }
                    });
                }
            });
            
           
            var table = $("#example").dataTable({
                "bFilter": false,
                "bSort": false,
                "paging": true,
                "bPaginate": true,
                "pagingType": "full_numbers",
                
                "columnDefs": [
                    { className: "pad-md-left-p-10 pad-top-bottom-p-10", "targets": [0, 1, 2, 3, 4, 5, 6, 7] }
                ],
                "lengthMenu": [[5,10, 15,20, 25, 35, 50, 100, -1], [5,10, 15,20, 25, 35, 50, 100, "All"]],
                "pageLength": 10 // Set the default page length to 10
            });
        
            

           
           
            table.destroy();

            
          
         
         

          

        });
    </script>

Posted 11-Jul-23 18:17pm

ahmed_sa

Updated 11-Jul-23 22:25pm

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Accepted Answer · 2023-07-11T22:25:00

Try reading your own code for a change:

JavaScript

$('#PrintServer-select').change(function () {
    ...
    // Create the DataTable:
    var tableShows = $('#example').DataTable({ paging: false });
    ...
    // Create the DataTable again:
    $('#example').DataTable();
    
    if ($.fn.dataTable.isDataTable('#example')) {
        // If the DataTable was created, call an unknown jQuery method on the element:
        $('#example').destory();
    } else {
        // Create the DataTable yet again:
        $('#example').DataTable();
    }
...
});

// Create the DataTable when the page loads:
var table = $("#example").dataTable({ ... });

// Then immediately call a different unknown jQuery method on the element:
table.destroy();

Aside from the fact that you can't consistently spell "destroy" between two different calls, and the fact that you're trying to call that method directly on the jQuery object rather than calling it properly as shown in the documentation[^], your code is absolute gibberish.

Even five minutes walking through your code with the debugger would have shown you that you:

Create the table;
Immediately try to destroy the table, but fail because you've not called the method correctly;
Create the table;
Create the table again;
Immediately try to destroy the table, but fail because you've not called the method correctly, and this time you can't even spell it properly;

And between all of that, you're not making any changes to the table at all, so the repeated calls to create and destroy it make absolutely no sense.

If it was anyone else, I would suggest explaining clearly and precisely what you are actually trying to do. But based on your history, I know there's no point; you'll just repeatedly demand that we "fix" your code for you, without telling what it's supposed to do.