Is it possible use a library https://datatables.net/?

[miasoft]

I have use this library in JoomlaComponentBuilder. It's very impressive.
Is any examples or tutorials for nubuilder?
I am new and don't know where I must insert this strings

27.12.png

[kev1n]

Hi,

Yes, you can use it within nuBuilder. Basically, you

1. Download the library from https://datatables.net/download/ and unpack it into a subfolder. E.g libs/datatables

2. In the (Setup ->) Header, add:

Code: Select all

</script>

<link href="libs/datatables/jquery.dataTables.min.css" rel="stylesheet">
<script src="libs/datatables/jquery.dataTables.min.js"></script>

<script>

3. Place the HTML code of your table in a HTML object.

4. Initialize the Plugin in the form's Custom Code as shown in the examples:

Code: Select all

$(document).ready(function() {
    $('#example').DataTable();
} );

If you have further questions, it might be easier to discuss on discord.

[ernesttan1976]

Very nice!

[kev1n]

This was some updated code I posted on Discord:

What still needs to be done is to handle the events, like click on a row, load next page etc..

Code: Select all

if (nuFormType() == 'browse') {
  
    $(document).ready(function() {

        $("DIV[id^='nuBrowse']").hide();
        $("DIV[id^='nucell']").hide();
        $("#nuRECORD").prepend('<table id="browse_dt" class="display" style="width:150%"></table>').css('width', '700px');
        $('#nuActionHolder').hide();
        $('.label').css('position', 'relative');

        $('#browse_dt').DataTable({
            data: nuSERVERRESPONSE.browse_rows,
            columns: nuSERVERRESPONSE.browse_columns
        });

    });
  
}