How to add an Ext.slider.Single to a TreeNode
I'm hoping someone can comment on an approach I can utilize to add an Ext.slider.Single to a TreeNode's label. After reading and trying a few things, I'm not even sure how to go about it.
Given the following contents of an Ext.tree.Panel, I would like to display an Ext.slider.Single with each of the service nodes where you see the "|-----------|".
I was originally thinking I could add something like '<div id="slider_*"></div>' to the text for the node and after rendering the tree, create the slider and renderTo each unique slider_* id. When I tried that though, I can get the slider to appear initially, but it's not actually next to the label and it disappears completely whenever the TreeNode is redrawn (like during expand/collapse). Then, it reverts back to just the '<div id="slider"></div>' string because that's what's in the raw name. So, then I thought perhaps after rendering the slider, I could get the HTML for it and update the raw name with this information.
- Some Service |-----------|
- layer 1
- layer 2
- Another Service |-----------|
- layer 3
However, just with what I have managed to figure out so far, this seems like a band-aidy (is that a word?) approach to me. So, I thought I'd ask if anyone has any suggestions for a different and likely more correct one. I have no problem doing the research and leg-work...I'm just not really sure what an appropriate approach to this type of thing might be.
Any suggestions are appreciated. Even a reference to somewhere where someone is adding some other ExtJs component to a TreeNode might give me some ideas but, alas, I haven't come across one so far.