DT editor

acdigital

Hello, I am a beginner, curious and I have some experience with jTables.
I ordered the DT editor and it was very easy to setup.

Now I have problems associating more than one plugin.
Actually I have the default editable table working fine as NEW, EDIT, DELETE.
I attempted to add Table tools and I have also COPY, PRINT, SAVE (CSV, XLX, PDF) in a drop down.
Only the print works partially asking me to use the browser print button. and the buttons are inactive.

So I need:

1. To insert the TableTolls swf patch in the right place for the initialization to make the buttons active.
2. Have the ColVis initializing together.
3. Have Child Row function and I will created the script for all the columns with a quick support form you.

I don't know how to inicialize all these functions together

That is it for while.

Paulo Lopes

allan

Only the print works

The other export buttons offered by TableTools are Flash based, so for some reason the Flash SWF isn't running for you. Must likely you will need to set the sSwfPath option to point to where the file is (example).

For ColVis - typically you can just add the C option to the dom parameter. See the documentation for ColVis initialisation.

Child rows - what code are you using at the moment? Are you following the example here: http://datatables.net/examples/api/row_details.html ?

Regarding the paid support options - support credits are available from the support page.

Regards,
Allan

acdigital

Allan, I see you are the DT supreme guru and I cannot understand how you are helping a beginner like me. It is very nice of you.

See, my knowledge is so elementary that you cannot understand my questions. :-)
I did try everything you mentioned 50 times each. I just don't know how to make two or more initialization inside the same script, I think I cannot call $(document).ready(function() {
$('#example').dataTable(); twice, please see my dilema bellow:

1. I want to know how to mix this both init. pieces of code:

$(document).ready(function() {
    $('#example').dataTable();
     
    $('#example tbody').on('click', 'tr', function () {
        var name = $('td', this).eq(0).text();
        alert( 'You clicked on '+name+'\'s row' );
      
    } );
} );

and...

$(document).ready( function () {
    var table = $('#example').DataTable();
    var colvis = new $.fn.dataTable.ColVis( table );
 
    $( colvis.button() ).insertAfter('div.info');
} );

IMPORTANT: COLVIS .CSS AND .JS ARE INSTALLED IN MY HEADER SCRIPTS.

I found a solution on google that made the TableTools active and working fine, thanks for your effort in helping but your code didn't work. Is there a way to make the PRINT button to open the local print setup instead of using the browser print feature?

"tableTools": {
            "sSwfPath": "extensions/TableTools/swf/copy_csv_xls_pdf.swf",
            "sRowSelect": "os",
            "aButtons": [
                { "sExtends": "editor_create", "editor": editor },
                { "sExtends": "editor_edit",   "editor": editor },
                { "sExtends": "editor_remove", "editor": editor },
                
                "copy",
                "print",
 
    {
 
        "sExtends":    "collection",
 
        "sButtonText": "Export",
 
        "aButtons":    [ "csv", "xls", "pdf" ]}
        
 
            ]
        }

How do I to have the custom row counting like See 10, 20, 50, 100 or all rows?
Perhaps this feature will show up when I have more than 10 entries automatically? Actually I am performing tests with two rows only.

Another thing I am completely lost is where and how to mix my editor generated .js and the Child row script? unfortunately the forum doesn't allow to attach files. :-(

MY EDITOR GENERATED .JS
<PRE>https://russolo.music.mcgill.ca/paulo/prospective/js/table.propect.js AND THE http://www.datatables.net/examples/api/row_details.html
</PRE>

Thanks again Alain,
Paulo Lopes

allan

Hi Paulo,

To combine your two scripts you would use:

$(document).ready( function () {
    var table = $('#example').DataTable();
    var colvis = new $.fn.dataTable.ColVis( table );
 
    $( colvis.button() ).insertAfter('div.info');

    $('#example tbody').on('click', 'tr', function () {
        var name = $('td', this).eq(0).text();
        alert( 'You clicked on '+name+'\'s row' );
    } );
} );

i.e. just initialise your table once, then add ColVis, then add the event listener.

Allan

acdigital

Dear Alain, thank you so much for the prompt help.
There is no way to make your code to work with my script.
What Am I doing wrong?

First attempt I inserted your combination script in my .js file first line.
https://russolo.music.mcgill.ca/paulo/prospective/js/table.propect.js

SECOND ATTEMPT I removed the combo init from the .js and included in the header:

$(document).ready(function() { var table = $('#example').DataTable(); var colvis = new $.fn.dataTable.ColVis( table ); $( colvis.button() ).insertAfter('div.info'); } );

Also, didn't work.
What Am I doing wrong?

Thanks again.

allan

I don't see any ColVis code at all in the file you linked to. Could you add your second suggestion and link me to the rendered page so I can take a look.

Allan