Okay,
What I'm trying to do is this ... I'm trying to create a radpanel dynamically depending on the data, but when the user hovers on the second level items, I'm trying to show some imagebuttons that allow the user to quickly perform operations on that item.
So, here's the panel before the user hovers:
Category A (open)
- Item 1
- Item 2
- Item 3
Category B (closed until clicked 'FullExpandItem')
When a user hovers over Item 1 - show this:
Category A (still open)
- Item 1 + X
- Item 2
- Item 3
Category B (still closed)
An item template that I'll need is something like this:
<ItemTemplate> |
<div class="floatbox" onmouseout="onMouseOut(this)" onmouseover="onMouseOver(this)"> |
<%# Eval("Text") %> |
<asp:ImageButton ID="addImgBtn" runat="server" OnPreRender="addImgBtn_PreRender" title='<%# Eval("ID") %>' ImageUrl="~/Images/Add.png" style="display:none; visibility: hidden;" /> |
<asp:ImageButton ID="openImgBtn" runat="server" OnPreRender="openImgBtn_PreRender" title='<%# Eval("ID") %>' ImageUrl="~/Images/Open.png" style="display:none; visibility: hidden;" /> |
</div> |
<ItemTemplate> |
the code for one of the image buttons does this: (right now, i'm just alerting what the ID is and the command, but I will be opening a radwindow to a page and set the ID=whatever in the querystring so I can dynamically show the data for that specific item.
Protected Sub addItemBtn_PreRender(ByVal sender As Object, ByVal e As EventArgs) |
Dim addItemBtn As ImageButton = CType(sender, ImageButton) |
If addItemBtn IsNot Nothing Then |
addItemBtn.Attributes("onclick") = "alert('add: " & addItemBtn.Attributes("title") & "'); return false;" |
End If |
End Sub |
with the following javascript:
function onMouseOut(lblCtrl) { |
if (lblCtrl !== null) { |
if (lblCtrl.children.length > 2) { |
for (i = 1; i < lblCtrl.children.length; i++) |
{ |
var imgCtrl = lblCtrl.children[i]; |
if (imgCtrl !== null) { |
imgCtrl.style.display = 'none'; |
imgCtrl.style.visibility = 'hidden'; |
} |
} |
} |
} |
} |
function onMouseOver(lblCtrl) { |
if (lblCtrl !== null) { |
if (lblCtrl.children.length > 2) { |
for (i = 1; i < lblCtrl.children.length; i++) |
{ |
var imgCtrl = lblCtrl.children[i]; |
if (imgCtrl !== null) { |
imgCtrl.style.display = 'block'; |
imgCtrl.style.visibility = ''; |
} |
} |
} |
} |
} |
Curious thing happens if I set that to the item template though - my items (the ones that have that inline hover menu) appear for every item (obviously, since there is no checking for which level (level = 1)) but that the regular databound items ALSO get put there.
What's a potentially correct way to go about this? I simply want to be able to specify what is in the second level items so I can put my inline hover menu there.
Help!
Kori