This topic contains 1 reply, has 2 voices, and was last updated by Sean Sean 2 years, 10 months ago.

Copying of a sample table


  • btsllc
    Participant

    Member Reply #2308

    Great theme!

     

    I would like to copy a sample table in the table-advanced.js so I can have multiple tables on a page use the settings.

    I’ve copied Table1 / Sample1 and renamed it to Sample31.  I’ve also added it to the init at the bottom of the page but it is not loading the table properly yet the one I copied does.

    Any advice?

     

    var initTable31 = function () {

    var table = $(‘#sample_31’);

     

    /* Table tools samples: https://www.datatables.net/release-datatables/extras/TableTools/ */

     

    /* Set tabletools buttons and button container */

     

    $.extend(true, $.fn.DataTable.TableTools.classes, {

    “container”: “btn-group tabletools-dropdown-on-portlet”,

    “buttons”: {

    “normal”: “btn btn-sm default”,

    “disabled”: “btn btn-sm default disabled”

    },

    “collection”: {

    “container”: “DTTT_dropdown dropdown-menu tabletools-dropdown-menu”

    }

    });

     

    var oTable = table.dataTable({

     

    // Internationalisation. For more info refer to http://datatables.net/manual/i18n

    “language”: {

    “aria”: {

    “sortAscending”: “: activate to sort column ascending”,

    “sortDescending”: “: activate to sort column descending”

    },

    “emptyTable”: “No data available in table”,

    “info”: “Showing _START_ to _END_ of _TOTAL_ entries”,

    “infoEmpty”: “No entries found”,

    “infoFiltered”: “(filtered1 from _MAX_ total entries)”,

    “lengthMenu”: “Show _MENU_ entries”,

    “search”: “Search:”,

    “zeroRecords”: “No matching records found”

    },

     

    // Or you can use remote translation file

    //”language”: {

    //   url: ‘//cdn.datatables.net/plug-ins/3cfcc339e89/i18n/Portuguese.json’

    //},

     

    “order”: [

    [0, ‘asc’]

    ],

     

    “lengthMenu”: [

    [5, 10, 15, 20, -1],

    [5, 10, 15, 20, “All”] // change per page values here

    ],

    // set the initial value

    “pageLength”: 20,

     

    “dom”: “<‘row’ <‘col-md-12’T>><‘row'<‘col-md-6 col-sm-12’l><‘col-md-6 col-sm-12’f>r><‘table-scrollable’t><‘row'<‘col-md-5 col-sm-12’i><‘col-md-7 col-sm-12’p>>”, // horizobtal scrollable datatable

     

    //  “dom”: “<‘row’ <‘col-md-12’T>><‘row'<‘col-md-6 col-sm-12’l><‘col-md-6 col-sm-12’f>r><‘table-scrollable’t><‘row'<‘col-md-5 col-sm-12’i><‘col-md-7 col-sm-12’p>>”,

     

    // Uncomment below line(“dom” parameter) to fix the dropdown overflow issue in the datatable cells. The default datatable layout

    // setup uses scrollable div(table-scrollable) with overflow:auto to enable vertical scroll(see: assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.js).

    // So when dropdowns used the scrollable div should be removed.

    //”dom”: “<‘row’ <‘col-md-12’T>><‘row'<‘col-md-6 col-sm-12’l><‘col-md-6 col-sm-12’f>r>t<‘row'<‘col-md-5 col-sm-12’i><‘col-md-7 col-sm-12’p>>”,

     

     

    });

     

    var tableWrapper = $(‘#sample_31_wrapper’); // datatable creates the table wrapper by adding with id {your_table_jd}_wrapper

     

    tableWrapper.find(‘.dataTables_length select’).select2(); // initialize select2 dropdown

    }

    return { //main function to initiate the module init: function () { if (!jQuery().dataTable) { return; } console.log(‘me 1’);

    initTable1();

    initTable10();

    initTable15();

    initTable2();

    initTable3();

    initTable4();

    initTable5();

    initTable6();

    initTable21();

    initTable31();

    console.log(‘me 2’); }

    Sean
    Sean
    Keymaster

    Posts: 4472
    Support Staff Reply #2322

    Hi,

    Could you please provide a screenshot of your browser console if there is any possible errors ?
    Also please make sure you have assigned the same ID to the table(in the HTML code) ?

    Thanks

Tagged: 

You must be logged in to reply to this topic.