DataTables / StateRestore

StateRestore extension for Datatables
Other
3 stars 3 forks source link

There are several features I am unable to implement with the current 1.0.0 version of State Restore. #2

Closed gouldner closed 2 years ago

gouldner commented 2 years ago

1) After a user selects a state I would like to display on the page what state they are viewing. This could be accomplished by changing the "Saved States" label to "Saved States - {current selected}" but ideally allowing a element to be provided to the api for where to display the current state would be nice.

2) I would like to have a "clear" button to clear the currently selected state and return to the default view. Once I select a view I can not find a way to return to the default view. something like table.stateRestore.clear(); so a clear button could be added as follows.

            {
                text: 'Reset View',
                action: function ( e, dt, node, config ) {
                    let table = $('#award-person-table').DataTable();
                    table.state.clear();
                    window.location.reload();
                }
            }

3) When the user leaves the page and returns later I would like to save the last state they selected. saveState: true works however there is no way to know what view you are returning to without feature #1 and no way to clear the state back to the default view without feature #2

I could create a "Default" pre-defined view which would solve the clear issue and allow me to use the saveState: true however without the ability to let the user know what state they are currently viewing saving the state is not ideal. So in order of priority #1 is most important and would allow a manual solution to #2 and #3.

AllanJard commented 2 years ago

Hi,

Thank you hugely for the feedback! It sounds like it basically comes down to part 1. What I'm not entirely clear about is what you mean by showing what state they are viewing. It does show the button for the active state in a different style. Do you mean you actually want to be able to show the text of the name of the state?

gouldner commented 2 years ago

The version I downloaded from the Datatables site doesn't not show the button for the selected state in a different style. Even the examples don't do that. For example I am using the alternative button. You can try it on sample page there is no indication of what view is currently active. https://datatables.net/extensions/staterestore/examples/initialisation/alternative.html

However I would like to provide the user with the current selected state without having to open the dropdown to see it. Either the button "Saved States" could change it's label to include the current state which might be difficult because the size of the button would have to keep changing. What I would prefer is the ability to provide a element on the page where the active saved state could be displayed. For example my page has a title bar and I could have a span in that bar where the current view could be displayed.

Here is an example: https://jsfiddle.net/gouldner/m1yjs6bp/

I would also prefer a clear state button, it seems pretty simple to just provide a means to return savedState to its initial state of not having a view selected, it just feel it is cleaner then having to create a "defaultState" for every table I build when I already configured the table with a default view. Again low priority but seems like an easy add.

I hope that make it more clear. Thanks for the extremely quick response.

gouldner commented 2 years ago

Would it be possible to pass the selected state name into stateLoadParams ?

stateLoadParams: function (settings, data) { // If I had the view name here I could update an element on my page with that text. }

AllanJard commented 2 years ago

I'm thinking we should have an API method which will get the name of the currently loaded state. Then it could be populated into any element you want on the page.

Regarding the buttons not showing the current state, that is an issue we'll look at. I'd thought that was working.

gouldner commented 2 years ago

I came to the same conclusion when I was reviewing the code and trying to see if I could somehow get access to the active selection. Sounds good to me.

I have never worked with typescript or I would have contributed the needed changes. I am looking into it now and may make some enhancements to contribute.

I have another issue with the Modal, when I add the toggle options for search,visible,order, etc the first toggle in indented so they don't line up. I tried to recreate the issue in jsfiddle but could not so it seems to be something with my page. I may have some css config for my modals that's messing it up. If I find it is a bug in the extension I will create a new issue with example.

Thanks for this extension, I have been wanting this feature for a long time and kept saying I should write one but never had the time. It's greatly appreciated!

AllanJard commented 2 years ago

Regarding building the software - yes, you need the DataTablesSrc repo and then this extension (and others) would be cloned into an extensions directory. https://datatables.net/manual/development/build is an overview.

We actually do all our development in a VM and I thought that was publicly available, but apparently not. I'll look into that.

For the modal error - if you can link to the page showing the error we can take a look.

SandyDatatables commented 2 years ago

Hi @gouldner ,

There are a couple of different things that have been mentioned here so let me see if I can highlight them all.

  1. A new API method needs to be made to get the name of the current state. I've raised an issue internally for this (DD-2391 for my reference) so that we can track it alongside our other issues. I'll try and remember to reference this issue in any commits that I make there.
  2. The buttons not showing their active state. There is something weird going on here. It works in this example from the live pages, but not on our website. I've raised another issue internally (DD-2392 for my reference) so we can look into that as well.
  3. Clearing the state. I think the best way for you to do this is to save a state on the initial load. That's clean and easy.

I'll get to work on those now and hopefully have some fixed made by this afternoon.

Thanks, Sandy

SandyDatatables commented 2 years ago

Hi @gouldner ,

The above commit has added in the api method for stateRestore.activeStates(). There are docs and an example there for how you might use it.

For 2, the issue here is that StateRestore requires a buttons release to show the active states. That's why my live example shows it working - it is using the nightly version. For now you can just use the nightly version of buttons and it will work for you. The next buttons release shouldn't be too far away.

I'll leave this open for now. Feel free to close if you are happy with that, otherwise I will wait for the buttons release.

Thanks, Sandy

SandyDatatables commented 2 years ago

Buttons was released on the 3rd of December and should now include the styling required to show the active buttons. You can find the latest version on the cdn. I'm going to close this issue now.

Thanks again, Sandy

gouldner commented 2 years ago

Thanks for the improvements, sorry I didn't respond to you sooner.

Regarding #3 you might still want to consider adding this feature. Your suggestion of storing the initial state so it can be reset will not work when stateSave is enabled. When stateSave is enabled and you select a state from the StateRestore dropdown, stateSave will save the settings from the StateRestore selection you chose. This means the next time the user visits the page the "initial" state will be the previously saved state from StateRestore.

The only way I see to fix this without stateRestore providing a clear selected state would be to hard code a "default" state. This means I have to configure all my settings twice. Once for DataTables to initialize to the correct state on the users first visit to the page and then again in StateRestore as a "Default" state.

If stateRestore could clear its current state and then allow the page to reload then it would fall back to the initial settings configured in DataTables and I would not have to put all of my initial state settings in twice. I hope that makes sense. I think providing the "clearSelected" method might be useful to others as well should you choose to implement it.

On a side note did you ever determine if the Virtual Machine you used for DataTables development is public or might be made so in the future?

SandyDatatables commented 2 years ago

Your suggestion of storing the initial state so it can be reset will not work when stateSave is enabled.

Sorry I think you have misunderstood me. This will only happen if you overwrite the state that you have saved within StateRestore on every page load. I'm suggesting that you do it once and then leave it alone - stateSave won't affect that.

On another note, you can hardcode your own initial state and set it as a predefined state if you wish - see this example.

I'll leave @AllanJard to comment on the Virtual machine.

Thanks, Sandy

gouldner commented 2 years ago

I get it now that makes sense. Seems we are all good now, 3 for 3. Cheers!

gouldner commented 2 years ago

Removed comment. Create new issue instead.