Skip to content
This repository has been archived by the owner on Apr 17, 2019. It is now read-only.

Fix for complex options rendering and adds table->hideColumn() for hidden columns (like primary key) #264

Open
wants to merge 5 commits into
base: master
Choose a base branch
from

Conversation

tblanchard
Copy link

This is a really great library - but I ran across two problems with it.

First, complex options rendering wasn't working properly. For instance, when using table tools which required a complicated bit of javascript to specify: eg

            oTable = jQuery('#jMlBQOLU').dataTable({
                "sPaginationType": "full_numbers",
                "bProcessing": false,
                "sAjaxSource": "/api/lots",
                "bServerSide": true,
                "dom": 'Tlfrtip',
                "pageLength": 100,
                "lengthChange": true,
                "lengthMenu": [10, 25, 50, 100, 250, 500, 1000],
                "tableTools": {
                    sRowSelect: "os",
                    sSwfPath: "/DataTables-1.10.4/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
                    "aButtons": [
                        {
                            sExtends: "text",
                            sButtonText: "Create",
                            fnClick: function () {
                                document.location.href = document.location.href + '/create';
                            }
                        },
                        {
                            sExtends: "text",
                            sButtonText: "Edit",
                            fnInit: enableButton,
                            fnSelect: enableButton
                        },
                        {
                            sExtends: "text",
                            sButtonText: "Spaces",
                            fnInit: enableButton,
                            fnSelect: enableButton
                        },
                        {
                            sExtends: "text",
                            sButtonText: "Remove",
                            fnInit: enableButton,
                            fnSelect: enableButton
                        }
                    ]
                }
            });

I found the tableTools structure not rendering properly for a variety of reasons - among them being a lack of recursion and no way to specify that a value was actually a javascript function name and shouldn't be quoted. I replace the template based rendering of the structure with a couple private recursive functions in Table itself and pass the fully rendered options string instead. I noticed that the original code would look for values starting with 'function' to guess if it were a javascript function that shouldn't be quoted. This is retained, however in my case I already had a javascript function I wanted to use as a callback. To fix this, I also added support for the javascript: uri scheme. Thus the above options looks like this in php now.

        $options = [
            "sPaginationType"=> "full_numbers",
            "bProcessing"=> false,
            "sAjaxSource"=> "/api/lots",
            "bServerSide"=> true,
            "dom"=> "Tlfrtip",
            "pageLength" => 100,
            "lengthChange"=> true,
            "lengthMenu"=> [ 10, 25, 50, 100, 250, 500, 1000 ],
            "tableTools"=> [
                "sRowSelect"=>"os",
                "sSwfPath"=> "/DataTables-1.10.4/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
                "aButtons"=>[
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Create",
                        "fnClick"=> "function() { document.location.href = document.location.href + '/create'; }"
                    ],
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Edit",
                        "fnInit"=> "javascript:enableButton",
                        "fnSelect"=> "javascript:enableButton"
                    ],
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Spaces",
                        "fnInit"=> "javascript:enableButton",
                        "fnSelect"=> "javascript:enableButton"
                    ],
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Remove",
                        "fnInit"=> "function(b){window.enableButton.call(this,b);}",
                        "fnSelect"=> "function(b){window.enableButton.call(this,b);}"
                    ]
                ]
            ]
        ];

I left the callbacks on the "Remove" button in the old style - either form does a javascript call on the function with this bound to the table.

The second feature I added was the ability to provide hidden columns. Generally, I need the primary key of a record to do anything but I don't necessarily want to show it to the user. So I added hideColumn to Table. It works a bit like addColumn except the column must already exist. You can use the index, name or alias.

$table = $t = Datatable::table()
            ->noScript()
            ->addColumn('ID', 'Name', 'Address', 'Description')  // these are the column headings to be shown
            ->hideColumn('ID') // columns to hide
            ->setUrl(route('api.lots'))
            ->setOptions($options);

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant