search

vakata / jstree

jquery tree plugin
http://jstree.com
MIT License
5.15k stars 1.38k forks source link

Checkboxes not working correctly #2550

Closed DaveInAus closed 3 years ago

DaveInAus commented 3 years ago

Hi

When I deselect a checkbox and send the new state to my server everything indicates correctly on the tree however when I reload the tree (page refresh) it still shows as selected even though the json indicates checked is false { "id": "768", "parent": "229", "text": "Women", "icon": "", "state": { "opened": false, "disabled": false, "selected": false, "checked": false, "checkbox_disabled": false } },

It would appear JSTree for some reason is always reading this node as checked.

Does the above JSON appear correct? I've also tried setting the cache to false and removing from local storage however this shouldnt be an issue as I dont have the state plugin

Config: "plugins": ["search", "checkbox" ], "search": { case_sensitive: false, show_only_matches: true }, "checkbox" : { keep_selected_style : false ,three_state : true ,whole_node : false// to avoid checking the box when clicking the node ,tie_selection : false // for checking without selecting and selecting without checking }

DaveInAus commented 3 years ago

Hi

When I deselect a checkbox and send the new state to my server everything indicates correctly on the tree however when I reload the tree (page refresh) it still shows as selected even though the json indicates checked is false { "id": "768", "parent": "229", "text": "Women", "icon": "", "state": { "opened": false, "disabled": false, "selected": false, "checked": false, "checkbox_disabled": false } },

It would appear JSTree for some reason is always reading this node as checked.

Does the above JSON appear correct? I've also tried setting the cache to false and removing from local storage however this shouldnt be an issue as I dont have the state plugin

Config: "plugins": ["search", "checkbox" ], "search": { case_sensitive: false, show_only_matches: true }, "checkbox" : { keep_selected_style : false ,three_state : true ,whole_node : false// to avoid checking the box when clicking the node ,tie_selection : false // for checking without selecting and selecting without checking }

DaveInAus commented 3 years ago

My bad - this is due to three state checkboxes and the results of all the checkboxes need to be sent to the server on click i.e. .on("check_node.jstree uncheck_node.jstree", function(e, data) { //Get status of nodes var selectedNodes = data.selected;

DaveInAus commented 3 years ago

However... .on("check_node.jstree uncheck_node.jstree", function(e, data) { var checkedNodes = $('#categoryTree').jstree("get_checked", false); data.selected or checkedNodes has the state of the selected nodes before the 'check' - i.e the checked nodes array has not been updated in the check_node.jstree uncheck_node.jstree events

Can this array be updated before the event is fired? or how does one get the updated array of checked nodes?

vakata commented 3 years ago

Those events fire at different times of the process. You can either use setTimeout, or use the changed.jstree event: https://www.jstree.com/api/#/?q=changed&f=changed.jstree

DaveInAus commented 3 years ago

Hi vakata Apologies for the late response I was listening for the changed tree event but never got it .on("changed.jstree", function(e, data) { console.log(JSTree Changed); }) I'll try the setTimeout

DaveInAus commented 3 years ago

A setTimeout of 100ms works fine - thanks again