SearchPanes - Feedback and Requests

mattlees

Hi,

Loving the new release, brings in some excellent new features. A couple of things I've noticed:

1. columns-6
   Still using the beta searchpane on a specific table as we have 9 selection boxes across the top. Having it flow to 2 rows in the searchpane takes up too much space. Any chance this can be expanded?

2. columns-4 to 6
   Using the standard UI, when I increase above 3 columns the pane controls drop to a second line as it seems the search box takes up the entire top row, which leads to point 3.

3. pane controls
   Can we have an option to remove the search as well as order, just leaving the 'x' to clear?

4. A bug
   I have a table with an external date selector, that modifies the ajax url, eg ajax_data.php?date=2020-02-28
   Works without issue until someone selects 2 dates that have no data. It then throws this error in the console and stops working until the page is refreshed:
   Uncaught TypeError: Cannot read property 'scrollTop' of undefined
   at f._updateCommon (datatables-1.10.20.min.js:452)
   at f.updatePane (datatables-1.10.20.min.js:426)
   at b.redrawPanes (datatables-1.10.20.min.js:464)
   at HTMLTableElement.<anonymous> (datatables-1.10.20.min.js:472)
   at HTMLTableElement.dispatch (jquery-3.4.1.min.js:2)
   at HTMLTableElement.v.handle (jquery-3.4.1.min.js:2)
   at Object.trigger (jquery-3.4.1.min.js:2)
   at HTMLTableElement.<anonymous> (jquery-3.4.1.min.js:2)
   at Function.each (jquery-3.4.1.min.js:2)
   at k.fn.init.each (jquery-3.4.1.min.js:2)

You can select a date with no data once, back to data, etc without issue. Only occurs when you hit zero data twice in a row. Haven't tested outside of this single table/data source. Below is the code once the ajax is updated to reload, rebuild and adjust column width:
dt.ajax.url('ajax.php?date='+data).load( function() { dt.searchPanes.rebuildPane(); dt.columns.adjust().draw(); } );

mattlees

One other question, how do you choose which data the searchPane uses?

I'm using render: function() to alter the display in the datatable, however I want the searchpane to use the original data (or something else of my choosing), not what i'm displaying in the table. Is this possible?

colin

On your second message, you can use orthogonal data for that - there's an example here doing something like that.

For 1 and 4, would you be able to create a test case please, to demonstrate those, it would help to understand the issue.

For 3, you can disable searching, but the element remains with just the title so that won't solve your problem. I'll let @sandy reply to this one, and 2.

Colin

sandy

Hi @mattlees ,

For points 2 and 3 - the best way for you to achieve this behaviour is to use some custom css. I've put together this example for you.

For your first point - we have expanded the display options to now include columns-1 through columns-9. You'll be able to access this from the nightly builds until the next release.

For your fourth point - as Colin has said, a test case would be great to understand what is happening there. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Thanks,
Sandy