when click button, show table using ajax

Hokwang

Hello.

I have some questions.

I want to receive some values and show datatable regarding that values.

user write value1 and value2 and then click search button.
and datatable will be shown.

$('#search').on('click', function() {
    var dt = $('#ct_table').DataTable({
        // basic
                destroy: true,
        processing: true,
        lengthChange: false,
        pageLength: 25,
        columns: [
            { data: 'cl' },
            { data: 'submitted_at' },
            { data: 'submitted_by' },
            { data: 'name' },
            { data: 'department' },
            { data: 'description' }
        ],
        
        // ajax
        ajax: {
            url: 'search.php',
            type: 'POST',
            data: {
                path: path,
                range: range,
                user: user
            }
        }
    });

    $('#ct_table tbody').on('click', 'td', function () {
        var tr = $(this).closest('tr');
        var row = dt.row( tr );

        if ( row.child.isShown() ) {
            row.child.hide();
            tr.removeClass( 'shown' );
        }
        else {
            row.child( row.data().description.replace(/(?:\r\n|\r|\n)/g, '<br />') ).show();
            tr.addClass( 'shown' );
        }
    });
});

1. Is this good way for using ajax or not? If not, can you show recommended code in brief?

2. I have a code for detailed row. but sometimes when I change value1 and value2 and then click search button,
   detailed row does not shown and error message is
   Uncaught TypeError: Cannot read property '_detailsShow' of undefined(…)
   I guess this is related with destroy option but I need help.

Thanks in advance.

Hokwang

@allan Please see this question. I need your help.

allan

Hi,

If you need support as quickly as possible, priority support is available.

Regarding your question, that looks like an okay approach. Another method, possibly better since you won't need to destroy the table, would be to use ajax.data as a function that will get the variables to send with the Ajax request and then use ajax.reload() to simply reload the data. Happy to put an example of that together under the support packages.

I'm not sure what is triggering the _detailsShow error - I suspect you are correct, but can't be certain without a test case.

Allan