Checked vs Selected

[Jim Peri]

I have a question.

While the checkbox plugin is enabled, is it possible to highlight the currently focused node as it would look when selected (without checkbox plugin?). 

Regards

J

[Ivan Bozhanov]

There is no difference between selected and checked - there is only one array (selected). The checkboxes are just another way of making multiple selections.

Best regards,
Ivan

[Gerard Avila]

Hi,

in this link:

http://orangehilldev.com/jstree-bootstrap-theme/demo

in the example "Tree with a checkbox plugin activated".

There are two different classes for each action: li.jstree-checked (when a checkbox is clicked) and a.jstree-clicked (when only the text is clicked).

So there are different behaviors in each case and the checked checkboxes are not unchecked when we select another node.

I'm trying to achieve exactly this functionality with v3.0.0. I have "whole_node" set to false, but insted of having the behavior described above it unchecks any other checked nodes when I click on a node text.

Is there any way to get it working this way?

Thanks in advance, and congrats for this awesome tool.

[Ivan Bozhanov]

Selected and checked are the same thing in 3.0.0 and up, the example you are referring to uses v.1.0-rc3.

Best regards,
Ivan

[Gerard]

Thanks for your answer. 

I will try to modify v.3.0.0 based on this functionality in v.1. Is this affordable or very problematic? Maybe this idea goes against the overall desing of v.3, and I will find many problems? As a second option, I could use v1 directly or even modify my design to adapt to the new functionality, but I would prefer to use v3 with this behavior. Any clues about the better aproach doing this would be apreciated.

Thanks and best regards

[Ivan Bozhanov]

You can build your own checkbox plugin based on src/jstree.checkbox.js ... simply do not modify or react to select_node, and instead build your own check_node method and maintain a checked array. That is what I would do if I were you - add a plugin for v.3.

Best regards,
Ivan

[Gerard]

This is a good tip to begin with, I'll try. If I get this working I will share it here and/or in any of jstree forums.

Thanks alot for your help and attention!

Best regards

[Daniel Young]

Hi,

Why are they the same now, what is the reason as for me clicking on the node and selecting it opens the content on the right while checking a check box doesn't change the content and just builds an array that is checked and used to perform other actions so the 2 are very different??

Dan

[Ivan Bozhanov]

What right side? jstree is component for visualizing trees, there is no right side ... Anyway - as I said earlier (search the forum here for checkbox discussions) - I have a strong point about this, but after all - it is trivial to modify the checkbox plugin so that it maintains its own separate collection, it will even be simpler than the current checkbox plugin.

Best regards,
Ivan

[chimos]

I tried, but I'm afraid that for now I am not able to program a plugin like this.

Is there some planning about doing such a feature? I'd be happy to use and make a contribution (50-100€) to jstree if you include this plugin.

Excuse me if I'm not realistic with the amount of work involved, but I don't have enough knowledge to value accurately.

Thanks and best regards

[Ivan Bozhanov]

I am really against such functionality, as I do not see the point in it - there is not much sense to have separate selection and checkboxes, as checkboxes are merely means to modify selection. I believe such a feature will bring more confusion than benefits.
For example: I do not see the point in having 5 nodes with checkboxes checked and 2 nodes marked in blue (as selected).
I will probably release such a plugin if enough people use it. As for the donation - jstree has never been about paying for a feature - if you like it - donate to the project - I will be very grateful, if you do not like it or cannot afford a donation - no problem.
I will keep you posted on this, if it is simple enough to achieve I will include a plugin in src/misc.js

Best regards,
Ivan

[chimos]

I understand, but your example is not exactly what I'm trying to describe.

The reason why I need this function is that I want to use the tree as a checklist. So the tree leafs are checkpoints that must be checked in a test process. The selection of the node (clicking on the node text) would be used to show content of the node somewhere else. So in this case, there would be no multiple selection, but single selection and multiple checking.

I understand that the checkbox plugin is made to make multiple selections but I think this functionality would extend the uses to jstree.

In any case, thanks alot for your quick answers. I will be attentive to know about this issue and look forward to see how the project goes further.

Best regards

[Ivan Bozhanov]

Will this list be nested? Because if not - you can achieve this functionality very very easy. Anyway - I see your point, I will see if I can integrate this into the current checkbox plugin as an option.

Best regards,
Ivan

[chimos]

These are good news =)

Yes, the list is nested, since there are "ul"s inside other "ul"s (max. 4 levels). Here is my json string:

$(function () { $('#test').jstree({

          "core" : { 

            

            "data" : [

              {

                "text" : "Root", 

                "state" : { "opened" : true },

                "children" : [

                  { "text" : "Test 1",

                    "children" : [

                    { "text" : "Child 1" },

                    { "text" : "Child 2" },

                    { "text" : "Child 3" },

                    { "text" : "Child 4" }]},

                  

                  { "text" : "Test 2",

                    "children" : [

                    { "text" : "Child 5",

                      "children" : [

                      { "text" : "Subchild 1" },

                      { "text" : "Subchild 2" },

                      { "text" : "Subchild 3" },

                      { "text" : "Subchild 4" },

                      { "text" : "Subchild  5" }]},

                      

                    { "text" : "Child 6" },

                    { "text" : "Child 7" },

                    { "text" : "Child 8" }]},

                  { "text" : "Test 3",

                    "children" : [

                    { "text" : "Child 9",

                      "children" : [

                      { "text" : "Subchild  6" },

                      { "text" : "Subchild  7" }]},

                    { "text" : "Child 10" },

                    { "text" : "Child 11" }]},

                  { "text" : "Test 4",

                    "children" : [

                    { "text" : "Child 12" },

                    { "text" : "Child 13" }]},

                ]

              },

            ],

            

            

            "check_callback" : true,  // check_callback to TRUE so that create works

            "themes" : { "variant" : "large", "icons" : false }, 

            "multiple" : true

            },

          "checkbox" : { 

            "whole_node" : false, 

            //"keep_selected_style" : false, 

            "three_state" : true 

            },

          "state" : { 

            "key" : "test_state" 

            },

          "search" : { 

            "fuzzy" : false 

            },

          "plugins" : [ "checkbox", "contextmenu", "dnd", "search", "state" ]

        });

Cheers

[James Canady]

This is a night mare.

I used version 1 with checkboxes and was really happy with the design. I'm trying to migrate to 3 and this really is a show stopper for me.

I have a tree of nested documents, selection in 1.0 allowed me to perform actions against the node or document without checking the node.

Checking the node is used for batch printing. I do NOT want to trigger a check for every selection. by tie the selection to checkboxes this is causing lots of issues.

I can't disable multiple selection as this limits the functionally of using checkboxes.

[Ivan Bozhanov]

I will probably add a setting for this next week (a setting which controls if checkboxes are tied to selection), keep an eye on the repo.

Best regards,
Ivan

[chimos]

Hi, are you still going to add this setting? Only to remember.

Some weeks are gone and this problem is almost the last stone on my way. I know I'm guilty of keeping working in something that was not solved yet (for my needs), but I'm afraid I already did a long way to implement jstree in my application, and I would be very happy being able to use it.

Sorry if this is already in the repo, but I couldn't find this commit.

Thanks and best regards

[Ivan Bozhanov]

No, it is not in the repo as I am having a hard time deciding if this should be integrated in the current checkbox plugin or implemented as a separate plugin. Anyway - I will try to have this ready by the end of next week.

Best regards,
Ivan

[chimos]

Thanks!

[Ivan Bozhanov]

I just added the tie_selection checkbox option, it is available on github. It is not throughly tested though.

Best regards,
Ivan

[chimos]

It seems to work perfectly so far. However I will test more next days and let you know if I find any issue.

You helped alot! I happilly contributed with your project

Thanks again

[Ivan Bozhanov]

Thanks for your generous support - I appreciate it very much.
Please get the latest from github - I just fixed an issue with checked / selected an hour ago.
Let me know if you run into any problems.

Best regards,
Ivan

[ChrisRaven]

Hi, Ivan

First of all, thank you for the tree, for it continuous support and development. I remember, I used it couple years ago in pre-1 versions, and it was great. Recently, I used it another project, and it is as awesome, as I remembered it.
However, I needed the checkbox plugin to work, like in the 0.x-1.x versions - separately from select.
It's because my scenario is as follows:
In an admin panel I display the tree in a modal dialog (from Bootstrap). In the tree there are categories and articles. User can create, edit, remove, move, and select any of them. When an article is selected, user can press an "Open" button in the dialog, to open associated "file" in CKEditor. But there are also checkoxes at every article. When a checkbox will be checked, it will mean, that the article should be shown in a knowledge base. So, as one can see, selecting and checking will have very different roles in this case.
I needed this option today, so it was very lucky to me, that you added it to the repository just a couple days ago. After few tries it works very good. But I have two problems.
First, how to mark in source data, which nodes should be checked? I tried to set $node['state'] = array('checked' => true) on my server side, and send it in JSON, but it doesn't work.
Also, when you close a node, which has children, then the checks are gone. I know, that it's because children are removed from DOM each time tree is closed, to make the tree even faster, but it would be nice, if the checked states were kept in internal data and restored when branch is reopened.

Best regards, ChrisRaven

[Ivan Bozhanov]

These 2 problems are definitely bugs - thanks for reporting. I will get back to you in a few hours when I can have a look (I am on the move now).

Best regards,
Ivan

[Ivan Bozhanov]

I just committed a fix. It looks OK now, but please tell me if you run into any problems, because I have not had the chance to thoroughly test this functionality.

Best regards,
Ivan

10 юли 2014, четвъртък, 01:24:05 UTC+3, ChrisRaven написа:

[ChrisRaven]

Thank you very much for such quick response and fixes.
Everything works perfect in both cases.

Best regards, ChrisRaven

[Dev D]

Hi Chris,

I have the same scenario as you had describe. Can you please explain, how did you separate 'select' and 'check' events? After setting, tie_selection to false, only 'check_node' event is called, if you select the node or check the checkbox.

Best Regards,

Dev

[Ivan Bozhanov]

It all depends on the rest of your config - if whole_node is set to true - yes, only check_node will be called.

Best regards,
Ivan

[Dev D]

Thank you Ivan. You made the things easier !

[chimos]

Hi Ivan,

"tie_selection" works correctly with responsivity enabled only when it is in big screen version, When it is used in small screen version selection and checking are tied again.

Best regards

TEST LINK

My config:

$('#jstree_test').jstree({

          "core" : { 

            "data" : [

              { "text" : "Root", 

                "state" : { "opened" : true },

                "children" : [

                  { "text" : "Item 1",

                    "state" : { "opened" : true },

                    "children" : [

                    { "text" : "Subitem 1.1",

                      "a_attr" : {"href" : "checklist.html"}},

                    { "text" : "Subitem 1.2"},

                    { "text" : "Subitem 1.3"},

                    { "text" : "Subitem 1.4"}

                    ]

                  },

                  { "text" : "Item 2"},

                ]

              }

            ],

            "check_callback" : true,  // check_callback to TRUE so that interactions ("create", "move", ...) work

            "themes" : { "variant" : "large", "icons" : false, "responsive" : true }, 

            "multiple" : true

          },

          "checkbox" : { 

            "whole_node" : false, 

            "keep_selected_style" : false, 

            "three_state" : true,

            "tie_selection": false

          },

          "state" : { 

            "key" : "checklist_tree_state" 

          },

          "search" : { 

            "fuzzy" : false 

          },

          "plugins" : [ "checkbox", "search", "state" ]

        });

[Ivan Bozhanov]

Thanks, I just committed a fix - please check if all is OK now (there was no icon visible, now it seems OK).

Cheers,
Ivan

[chimos]

Thanks again for your support.

I just updated but it doesn't work correctly yet.

see TEST LINK

[chimos]

sORRY, i forgot to link altough is the same above. TEST LINK

[Ivan Bozhanov]

I do not see the fix? Did you pull the version? The stylesheet does not contain the fix: http://dosdaus.com/css/styles.css
The fix was in the theme (the CSS).

Best regards,
Ivan

[Gerard Avila]

Yes, I downloaded jstree-master from github. Actually I renamed the file to jstree.css, so it should be in http://dosdaus.com/css/jstree.css . Styles.css is my main stylesheet where I overwrite some rules of jstree css.

I tried updating css from 'src/themes/default' and from 'dist/themes/default/'

I updated jstree.js from 'dist/' as well.

Selection and check are still behaving weird in little screen mode.

Cheers

--
You received this message because you are subscribed to a topic in the Google Groups "jsTree" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/jstree/f-awjtsEOPw/unsubscribe.
To unsubscribe from this group and all its topics, send an email to jstree+un...@googlegroups.com.
To post to this group, send email to jst...@googlegroups.com.
Visit this group at http://groups.google.com/group/jstree.
For more options, visit https://groups.google.com/d/optout.

--
Gerard

[Ivan Bozhanov]

Just fix your overrides, as they are the ones causing the problem.

Best regards,
Ivan

To unsubscribe from this group and all its topics, send an email to jstree+unsubscribe@googlegroups.com.

To post to this group, send email to jst...@googlegroups.com.
Visit this group at http://groups.google.com/group/jstree.
For more options, visit https://groups.google.com/d/optout.

--
Gerard

[Gerard Avila]

Sorry, you are right. I colud fix it, thanks!

To unsubscribe from this group and all its topics, send an email to jstree+un...@googlegroups.com.

To post to this group, send email to jst...@googlegroups.com.
Visit this group at http://groups.google.com/group/jstree.
For more options, visit https://groups.google.com/d/optout.

--
Gerard