Skip to content
This repository was 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
tblanchard wants to merge 5 commits into
Chumper:masterfrom
tblanchard:master
Open

Fix for complex options rendering and adds table->hideColumn() for hidden columns (like primary key)#264
tblanchard wants to merge 5 commits into
Chumper:masterfrom
tblanchard:master

Conversation

@tblanchard

Copy link
Copy Markdown

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

1 participant