Custom buttons - Show All Except and Date buttons

colin

Can you give steps on how to reproduce, please,

Colin

ArielSAdamsNASA

@colin

If you look at my latest fiddle, it does not work: http://live.datatables.net/qesulece/1/edit

I have two custom date buttons and one clear button. I am trying to make the Last 8 Months button selected by default.

ArielSAdamsNASA

Correction, Last 7 Months show by default*. You have to clear your cache and click the link to see that it does not work.

http://live.datatables.net/qesulece/7/edit

kthorngren

To make the test case easier to work with lets comment out the code that sets the buttons based on the restored loadedState.dateSearch. Use the name assigned to the button as the button-selector. Since you are triggering the button the code in the action function will execute so you don't need to set the rangeSearch value nor call draw().
http://live.datatables.net/segacugo/1/edit

Kevin

ArielSAdamsNASA

@kthorngren

When using your suggestion of using loadedState.hasOwnProperty, it does show Last 7 Months by default, but it shows it no matter what other button is clicked on refresh. I just want this to show on the first load of the page.

http://live.datatables.net/segacugo/3/edit

kthorngren

but it shows it no matter what other button is clicked on refresh.

I commented out the code to restore the buttons state just for ease of using the test case, ie, not having to lear the cache each time. Just uncomment that code to restore the buttons on page load.

Kevin

ArielSAdamsNASA

@kthorngren

Right, when you uncomment the code, click Clear and Run with JS, both Clear and Last 7 Months are selected. http://live.datatables.net/vepokacu/1/edit

kthorngren

You have your if statement blocks misaligned. Also you need to check to see if dateSearch doesn't exist with not (!), like this if ( ! loadedState.hasOwnProperty( "dateSearch" )) {. I commented out some unnecessary if blocks and added the not.
http://live.datatables.net/zuhilaqa/1/edit

Kevin

ArielSAdamsNASA

@kthorngren

Now the load state for all the buttons work, but the Past 7 Days button is not selected by default.

http://live.datatables.net/texowaca/1/edit

kthorngren

If you comment out //data.dateSearch = dateSearch; in stateSaveParams you will see that it defaults to 7 days. You might need to load the page twice to clear out the previously saved dateSearch.
http://live.datatables.net/fonovotu/1/edit

Kevin

ArielSAdamsNASA

@kthorngren

The link given does not allow the other buttons to save its state when clicking Run with JS. For example, clicking Clear and then Run with JS defaults to Past 7 Days.

Is it not possible to have Past 7 Days default on the first load and then allow the save state for all three buttons?

kthorngren

I changed the test case to allow for clearing the saved state.
http://live.datatables.net/fonovotu/2/edit

If you clear the state the default 7 days button should be active. Otherwise the last button clicked will be active on page load. Also made a few other changes to handle the empty stateSave.

Kevin

ArielSAdamsNASA

@kthorngren

Thank you, that worked for the most part!

When I first load my website, it seems as if it is not even getting to the $(document).ready( function () {} functions. In other words, all the functions after the setup of buttons are not reached starting from:

//NOT GETTING HERE 
  new $.fn.dataTable.SearchPanes(table, {});
  table.searchPanes.container().insertAfter('#spButton').addClass('hide-sp').attr("id","spCont");
  table.state.save();  // Save the current visiblity state of hidden

I know this is true because I have $('.buttons-show').detach().prependTo('.dataTables_length') and the button, buttons-show, does not move from it's original place.

Do you know what would be causing this?

kthorngren

Is that issue replicated in the test case? If so let us know how to replicate the problem. If the problem is not replicated please post a link to your page or update the test case to show the issue.

Look for errors in the browser's console log.

Kevin

ArielSAdamsNASA

@kthorngren

Unfortunately, I cannot replicate the issue in a test case because I am using Django and a database for the table items and in some functions. I also cannot share the website since it is an internal link only NASA employers can access. Here is a screenshot of the console.

ArielSAdamsNASA

@kthorngren

Has to do something with reading toString. The only time string is found in the html page is (typeof data === 'string' && data.match(/<[^>]*>/) !== null ?. Found here: http://live.datatables.net/kuvavapu/2/edit

kthorngren

Looks like the problem is with SearchPanes. I would start by loading dataTables.searchPanes.js instead of dataTables.searchPanes.min.js as this will show more useful information about the error. Post the full traceback of that error for the developers. Maybe you can take an example of your data and place it in a test case to replicate the issue. My guess is there is something in your data that is causing the SearchPanes error.

Kevin

ArielSAdamsNASA

@kthorngren

I am waiting for my change to use dataTables.searchPanes.js to be pushed to the dev server. In the meantime, I made a test case.

http://live.datatables.net/ricukaze/1/edit

I see that it has warnings for the switch case, but it works fine with those warnings here: http://live.datatables.net/kuvavapu/2/edit

sp_hidden warning works here: http://live.datatables.net/cayuqimo/1/edit

kthorngren

I see that it has warnings for the switch case,

You didn't load the datatables.buttons.js files.

Kevin

ArielSAdamsNASA

@kthorngren

http://live.datatables.net/riyejume/1/edit

Here is the updated test case, I included all the js and css files I am using.

The switch case does have warnings, but I do not think it is the cause of the issue because it works here http://live.datatables.net/kuvavapu/2/edit

kthorngren

I looked at both test cases and don't see any warnings. Please provide details of how to show the problem you are trying to debug.

Kevin

ArielSAdamsNASA

@kthorngren I cannot reproduce the error in a test case, but it has all the code I am using for the website. I think the error occurs because of (typeof data === 'string' && data.match(/<[^>]*>/) !== null ? because every time it does not work, it shows this in the console. The error is that it is not even getting to the $(document).ready( function () {} functions. I know this because the filters won't open, buttons are not moved to the right, and there is no data in the table.

colin

Please can you link to a page where this error occurs so we can debug it,

Colin

ArielSAdamsNASA

@colin The website is private, for internal use only. So, I cannot link it. But I provided a test case with all the datatables code I am using.

ArielSAdamsNASA

So the error occurs when I click an option in the searchpanes, click away to another page and go back to the table. I removed the function that uses (typeof data === 'string' && data.match(/<[^>]*>/) !== null ? and the error still occurs.

The searchpanes uses save state which seems to be the issue because of:

// Get all of the data needed for the state save from the pane
                    if (_this.s.dtPane !== undefined) {
                        selected = _this.s.dtPane
                            .rows({ selected: true })
                            .data()
                            .map(function (item) { return item.filter.toString(); })
                            .toArray();
                        searchTerm = _this.dom.searchBox.val();
                        order = _this.s.dtPane.order();
                        bins = rowData.binsOriginal;
                        arrayFilter = rowData.arrayOriginal;
                        collapsed = _this.dom.collapseButton.hasClass(_this.classes.rotated);
                    }

colin

I'm not seeing it with this example, which is also using stateSave - if you're unable to link to your page, to progress this please update that example to demonstrate the issue,

Colin