Checkbox event checked / unchecked

3,626 views
Skip to first unread message

Kheang

unread,
Jul 27, 2010, 2:24:25 PM7/27/10
to jsTree
Hi,

What event should I use if I want to listen for when a checkbox is
checked or not?

I have looked at the documentation and I've seen check_node and
change_state, but nothing happens when I try binding check_node and
doing an alert.

change_state seems to trigger but the issue is when I do a refresh (my
tree is loaded using xml) it always triggers the change_state.

I basically want to do an ajax call on check or uncheck of a checkbox
in my tree.

Has the documentation been updated?

vakata

unread,
Jul 28, 2010, 4:28:07 AM7/28/10
to jsTree
Sorry about that - it is my bad.
check_node and uncheck_node will trigger events as of the next commit
(I will commit in a few minutes)

As for change_state - it is triggered initially and on refresh (to
preserve the state).

Kindest regards and once again - sorry,

Ivan

Kheang

unread,
Jul 28, 2010, 8:09:34 AM7/28/10
to jsTree
Ahhh ok :)

I will wait for your commit.

Thanks!
> > Has the documentation been updated?- Hide quoted text -
>
> - Show quoted text -

Kheang

unread,
Jul 28, 2010, 10:03:04 AM7/28/10
to jsTree
Hi I just tried the latest commit and it works great!

I just had a quick question about uncheck_node, is there a way to
detect if the uncheck is triggered by a "click" ?

On Jul 28, 4:28 am, vakata <ivan.bozha...@gmail.com> wrote:

Kheang

unread,
Jul 28, 2010, 10:05:10 AM7/28/10
to jsTree
Hey I just noticed that check_node and uncheck_node is also triggered
when clicking the expand, un-expand buttons.
Is that normal? Is there a way to detect that action too?

On Jul 28, 4:28 am, vakata <ivan.bozha...@gmail.com> wrote:

Kheang

unread,
Jul 28, 2010, 10:52:09 AM7/28/10
to jsTree
It's me again,

I am trying to find out how to open all nodes on load, but I noticed
that all the examples I've found in the discussion group doesn't seem
to work for me.
Is it possible since im using checkbox plugin + XML DATA that it
doesn't work correctly?

I assume since the XML data is returned and loaded who knows when, it
doesn't work the way others have gotten it to work.
I am assuming I need to find the event that triggers when the XML is
rendered or tree is rendered?

I also tried simply putting the class="jstree-open" in the xml data
but I then noticed that there is always a jstree-closed class on
everytime.
Will there be or is there away to remove the jstree-closed class and
only have it when we need it, like maybe specify it in the
configuration or something?

On Jul 28, 4:28 am, vakata <ivan.bozha...@gmail.com> wrote:

vakata

unread,
Jul 29, 2010, 3:41:44 AM7/29/10
to jsTree
Hi,

I just fixed the open/close issue with checkboxes - now the events
won't trigger (unless async is used and the node is opened for the
first time).

There is now way to see which event caused the check/uncheck - sorry!

As for the open_all - try:

$("#tree-container").bind("reopen.jstree", function (e, data) {
data.inst.open_all();
});

For the closed icon - it is only shown if the node has children, or
has an attribute "state" which is set to "closed" (in the XML source).
Also if you set "state" to "open" it will show the node as opened.

Kindest regards,
Ivan

eric

unread,
Jul 29, 2010, 10:08:01 AM7/29/10
to jsTree
hi

i had the same issue with open/close and checkboxes, thanks for fixing
it, will it be committed soon? :))
> > > >checkedor not?

vakata

unread,
Jul 29, 2010, 3:34:12 PM7/29/10
to jsTree
Tomorrow morning - I left the fixes at the office - sorry (so in about
10-12 hours). I have some other fixes here at home so I will merge
tomorrow morning and commit.
Cheers,
Ivan

eric

unread,
Jul 30, 2010, 5:32:27 AM7/30/10
to jsTree
ok i'll wait for your commit, cheers!

vakata

unread,
Jul 30, 2010, 5:40:33 AM7/30/10
to jsTree
It should be OK now ... (rev.205)

Kindest regards,
Ivan

eric

unread,
Jul 30, 2010, 8:23:39 AM7/30/10
to jsTree
works nicely, thanks!

Kheang

unread,
Jul 30, 2010, 8:33:48 AM7/30/10
to jsTree
Thanks Ivan, the new changes and/or fixes work great!

Is there a way to set an attribute to XML data for nodes to be
checked?
Would it be possible to add that functionality? I believe it would be
a great addition.
As the only way i've gotten it to work so far based on my search of
the discussions was to make an ajax call to grab all the ids of the
nodes that are checked and loop through that and check them after the
jstree xml is loaded.
It works but it would be way more efficient if we could simply pass a
state or something like that "checked" on each nodes when passing the
XML data to the tree.

Oh yeah and another quick question would be, why does the uncheck_node
event triggers when loading the tree the first time?
> > > > > > > > - Show quoted text -- Hide quoted text -

vakata

unread,
Jul 30, 2010, 9:16:27 AM7/30/10
to jsTree
Hi,

1) Just add an attribute named "class" (if you do not have it) to the
ITEM node with a value containing "jstree-checked".
2) Sorry - there were a few more bugs with checkbox. I just fixed them
and will commit in a few minutes. I hope this time everything is
fine :)

Cheers,
Ivan

Kheang

unread,
Jul 30, 2010, 9:21:46 AM7/30/10
to jsTree
So if I put the class="jstree-checked" it will work for all the nodes?

I didn't use this option because I read in a previous post that it
only worked for parent nodes?
Has this changed since?

Thanks a lot!

vakata

unread,
Jul 30, 2010, 9:38:25 AM7/30/10
to jsTree
The thing about parent nodes was in the get_ functions - they used to
return only checked nodes - if a parent had three children and all are
checked, the get_checked function would return only the parent node,
but now you have the option to return all 4 nodes. ANyway - the class
should work - just test and let me know if it does not.

Cheers,
Ivan

Kheang

unread,
Aug 4, 2010, 3:16:04 PM8/4/10
to jsTree
Hi,

I just noticed that if I have a parent node with child nodes and I add
the class "jstree-checked" on the main node, it doesn't seem to want
to check it by default.
Is there a reason why?
Do I need to check all the child nodes in order to get the parent one
checked?

I am using XML flat file method and it was simple for me to simply add
the class "jstree-checked" to the ones that are checked.

It currently works when I select a few of the child nodes of that
parent.
But when I select the parent it returns me the id of the parent, which
is ok for me since that's what I need.
But it doesn't seem to check it.

Kheang

unread,
Aug 5, 2010, 9:57:11 AM8/5/10
to jsTree
Hi Ivan,

I have noticed something else while doing a test.
When my XML tree is loaded and the first parent node in the tree is
"checked" it triggers a "change_state".
So if I put a function call to save the node being checked or
unchecked, everytime I check the very first item on my tree, it always
unchecks it everytime since it triggers a change_state as soon as it's
checked and refreshed.

What I was experimenting with was to be able to save a checked or
uncheck node on change_state, but then I noticed this.
Is this normal?

Thanks!

Alex

unread,
Aug 6, 2010, 12:09:09 AM8/6/10
to jsTree
From that 'check_node' event that gets fired, how can you dig down and
find out which nodes are being selected?

I'd like to have an event that fires on each leaf node, whenever it is
selected, but can't seem to work out how.

Any ideas?


Alex

Kheang

unread,
Aug 6, 2010, 8:09:24 AM8/6/10
to jsTree
I use this to find out what checkbox are selected.

var array_nodes = [];

// loop through each checked
$("#categories-container").jstree("get_checked").each(function(key,
value){
// get id
var current_id = getId($(value).attr("id"));

if (current_id) {
// main node
array_nodes.push('ids[]='+current_id);
}
});

for the current one I think you can do

data.rslt.attr("id")

On Aug 6, 12:09 am, Alex <a...@heaton.me> wrote:
> From that 'check_node' event that gets fired, how can you dig down and
> find out which nodes are being selected?
>
> I'd like to have an event that fires on each leaf node, whenever it is
> selected, but can't seem to work out how.
>
> Any ideas?
>
> Alex
>
> On Aug 5, 2:57 pm, Kheang <k...@simplecommerce.com> wrote:
>
>
>
> > Hi Ivan,
>
> > I have noticed something else while doing a test.
> > When my XML tree is loaded and the first parent node in the tree is
> > "checked" it triggers a "change_state".
> > So if I put a function call to save the node beingcheckedor
> > unchecked, everytime I check the very first item on my tree, it always
> > unchecks it everytime since it triggers a change_state as soon as it's
> >checkedand refreshed.
>
> > What I was experimenting with was to be able to save acheckedor
> > uncheck node on change_state, but then I noticed this.
> > Is this normal?
>
> > Thanks!
>
> > On Aug 4, 3:16 pm, Kheang <k...@simplecommerce.com> wrote:
>
> > > Hi,
>
> > > I just noticed that if I have a parent node with child nodes and I add
> > > the class "jstree-checked" on the main node, it doesn't seem to want
> > > to check it by default.
> > > Is there a reason why?
> > > Do I need to check all the child nodes in order to get the parent one
> > >checked?
>
> > > I am using XML flat file method and it was simple for me to simply add
> > > the class "jstree-checked" to the ones that arechecked.
>
> > > It currently works when I select a few of the child nodes of that
> > > parent.
> > > But when I select the parent it returns me the id of the parent, which
> > > is ok for me since that's what I need.
> > > But it doesn't seem to check it.
>
> > > On Jul 30, 9:38 am, vakata <ivan.bozha...@gmail.com> wrote:
>
> > > > The thing about parent nodes was in the get_ functions - they used to
> > > > return onlycheckednodes - if a parent had three children and all are
> > > > > > > nodes that arecheckedand loop through that and check them after the

Alex

unread,
Aug 7, 2010, 9:19:23 AM8/7/10
to jsTree
That doesn't work at all for me, I think mainly because 'get_checked'
doesn't actually return a list of checked items...

Any idea how to just get a list of all checked leaf nodes?


Alex

ChrisR

unread,
Aug 7, 2010, 9:48:16 AM8/7/10
to jsTree
Hi,

Maybe

$('#tree_id').find('.jstree-leaf.jstree-checked');

will help you.

Best regards,
ChrisRaven
> ...
>
> więcej »

Alex

unread,
Aug 7, 2010, 1:34:00 PM8/7/10
to jsTree
Yea, that's what I ended up doing. I was wondering how get_checked
worked though.
> > > > > > > > > > > > > > > > > > > Hi,...
>
> read more »

Kheang

unread,
Aug 7, 2010, 2:12:15 PM8/7/10
to jsTree
That's how im using it and it works, if your using the latest rev it
should work too.

You could try on click example:

$(function(){
$("#some_button").click(function(){
// loop through each checked
$("#categories-
container").jstree("get_checked").each(function(key,
value){
alert($(value).attr("id"));
});
});
});

this basically loops through all checked items and return it's id=""
attribute if you've set one for each node.
> > > > > > > > > > > > > > > > > > > (I will- Hide quoted text -
>
> - Show quoted text -...
>
> read more »
Reply all
Reply to author
Forward
0 new messages