PDA

View Full Version : CheckTree reloads blank image on every check/uncheck



art.home.ext
27 Oct 2012, 11:58 AM
Hi all !
Please launch "Check Tree example" !
Now, can anybody tell me how to avoid ExtJs from reloading the blank image each time (and for each preceding and following sibling) the "tree checknode" is checked/unchecked ?
I'm using Chrome developer tools and its "Network tab" to follow this !
Many thanks
r@ge

mitchellsimoens
29 Oct 2012, 6:22 AM
What do you mean blank image? When you expand/collapse? Notice it loads from cache (look in the size column of the network tab)

art.home.ext
30 Oct 2012, 1:35 AM
Thank you for replying.

FYI, I'm talking about CheckTree node example.

For blank image, I mean the images contained in each tree node :

<div class="x-grid-cell-inner " style="text-align: left; ;">
<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" class="x-tree-elbow-empty">
<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" class="x-tree-elbow">
<input type="button" role="checkbox" class="x-tree-checkbox x-tree-checkbox-checked" aria-checked="true">
<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" class="x-tree-icon x-tree-icon-leaf ">
My child node</div>

In fact, I was wrong when I said that blank image is reloaded for each preceding and following tree node. What is happening is that the whole DOM nodeis rebuilt. In the example above, there are 3 blank images that are reloaded (and you are right, they are cached, but even re-displayed each time the checkbox is manually checked and unchecked.

This is strange that click on a checkbox makes the node to be rebuilt. The only things that change on node are :
add class names on <TR> : x-grid-row-selected x-grid-row-focused
add class name on <TD> : x-tree-checked
add class name on <INPUT> : x-tree-checkbox-checked
add aria-checked="true" on <INPUT>

The redraw is obvious if you alert("something") on TreeView 'checkchange' event. You will notice that node icon disappears.

Since the redraw affects only the clicked node, it is less annoying than I thought.
But what is strange is that a click on a checkbox makes the DOM node to be rebuilt and then redrawed.

Hope you understand the problem