Handling checkbox states with AJAX/JSON loading

2,046 views
Skip to first unread message

Skywalker

unread,
Jun 21, 2010, 5:15:56 PM6/21/10
to jsTree
Hey there,
nice tree, easy to set up and works pretty. Theres only one problem I
can't fix. How is it possible to set the selected state of the
checkbox plugin in JSON data? I've seen
http://groups.google.com/group/jstree/browse_thread/thread/edb7b99c880695df
and you mentioned a "selected config option". I couldn't find an
explanation of that config option in the documentation and couldn't
work out where I have to set it. Does the current version even support
such a feature?
Thanks in advance!

vakata

unread,
Jun 22, 2010, 1:36:19 AM6/22/10
to jsTree
Hi,

At first my answer would be NO, but when I did some preliminary
testing using the latest commit - try passing "jstree-checked" for a
classname on the li node:

{ "attr" : { "class" : "jstree-checked", ... // you can also add some
other classes if needed

Maybe that will do it :)

Cheers,
Ivan

On 22 Юни, 00:15, Skywalker <let...@gmx.de> wrote:
> Hey there,
> nice tree, easy to set up and works pretty. Theres only one problem I
> can't fix. How is it possible to set the selected state of the
> checkbox plugin in JSON data? I've seenhttp://groups.google.com/group/jstree/browse_thread/thread/edb7b99c88...

Skywalker

unread,
Jun 22, 2010, 10:09:46 AM6/22/10
to jsTree
Hi,

thanks for the fast support. I've tried implementing the hint you gave
me. The following is a piece of the generated JSON:
[{"data":"b:default","attr":{"id":"b:default","class":"jstree-
checked"},"state":"closed"},{"data":"b:core","attr":
{"id":"b:core"},"state":"closed"}]
As you can see the nodes classes should contain jstree-checked. As
soon as the tree is loaded, none of the two nodes are marked as
checked. In opposition to that
jQuery("#tree").jstree("get_checked");
returns the two nodes, even though they are not displayed as checked.
Inspecting the tree with FireBug sheds a bit light on the cause of the
problem - the classes of the nodes are:
jstree-checked jstree-closed jstree-unchecked
So what happens is, that the browser parses the unchecked rule lastly
wherefore the checkboxes are not checked. Is that a bug? Or how is it
possible for a node to have both classes? Is there any workaround?

Cheers,
Fabian

Ivan Bozhanov

unread,
Jun 22, 2010, 5:41:25 PM6/22/10
to jstree
Hi,

Try using the latest commit -it should be fixed ... I will test more tomorrow :)

Cheers,
Ivan

> --
> You received this message because you are subscribed to the Google Groups "jsTree" group.
> To post to this group, send email to jst...@googlegroups.com.
> To unsubscribe from this group, send email to jstree+un...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/jstree?hl=en.
>
>

Skywalker

unread,
Jun 23, 2010, 11:28:23 AM6/23/10
to jsTree
Hi,

thanks a lot there! Great work and seems to be working. I'll keep you
up to date with bugs :) As a matter of fact i'm a jQuery beginner so I
can't fix the bugs myself...

Cheers,
Fabian

Polaris431

unread,
Jun 25, 2010, 4:36:31 AM6/25/10
to jsTree
Sorry, but that is a really bad design. Using a class to set the
checkbox state. Developers who use WCF to create structs or classes on
the server to hold the treeview properties would be required to create
a property called "class" but that is not allowed as the word "class"
is a keyword in languages like C#. The alternative is to not use
structs or classes and revert to creating a JSON string where you can
include the "class" member. Personally Ivan, I don't think you thought
your design out carefully enough. The "checked" state is a property of
a node and should be handled with either boolean data types or some
other data type to handle a three state. Using a CSS class to control
a property is really bad design.

vakata

unread,
Jun 26, 2010, 4:57:57 PM6/26/10
to jsTree
Actually this is a backup option - you have a lot of other ways of
controlling selection, and I strongly believe the checked state should
not be passed with the data (if it async). Because this would mean for
example visualising a node as unchecked, opening it, and the developer
diceded to mark a node as checked (among the returned children) this
would mean changing all the parents above that node to undermined
which I believe is extremely bad practice as it will confuse the user
(who has already made some selection and won't expect a server
intervention).
You can check/uncheck nodes onload and also using the built in events,
as I said - the class name is backup option for people who decided to
follow that BAD design of passing selection state along with the data.
As for getting the data back - the API provides quite a few ways.

That is about it - I just strongly disagree jstree is badly designed,
I think supplying the selection state with the data instead of using
the built in capabilities can be considered BAD design.

Kindest regards,
Ivan
Reply all
Reply to author
Forward
0 new messages