Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 643
  • Last Modified:

Open a window using the event MouseOver

Hi

I have a datalist that contains a datagrid inside as a SelectedItemTemplate  this datagrid   has in one of its colums an image button, what I want to do is that When the user pass the mouse over the imagebutton open a small window and pass to this window an argument; of course when the user do the mouse out this window will close. I show you the HTML code to give you an idea

<html>
<head>
</head>
<body>
    <form runat="server">
        <div align="center">
            <asp:DataList id="dtlMakes" runat="server" CellSpacing="2" OnItemDataBound="GetAutos" OnItemCommand="DoItemSelect" DataKeyField="IdMake" CellPadding="1" Width="505px">
                <ItemStyle verticalalign="Top" backcolor="WhiteSmoke"></ItemStyle>
                <FooterStyle font-bold="True" forecolor="MidnightBlue" backcolor="LightSteelBlue"></FooterStyle>
                <HeaderStyle font-bold="True" forecolor="MidnightBlue" backcolor="LightSteelBlue"></HeaderStyle>
                <SelectedItemTemplate>
                    <asp:ImageButton CommandName="UnSelect" ImageUrl="images/clickup.gif" Width="16" Height="17" runat="server" AlternateText="Click to hide adds" />
                    <asp:Label runat="server" text='<%# Container.dataitem("Make")%>'>Label</asp:Label>
                    <asp:DataGrid id="GridAutos" runat="server" AllowSorting="True" BackColor="#EEEEEE" HorizontalAlign="left" Font-Name="Verdana" CellPadding="4" AutoGenerateColumns="False" DataKeyField="IdAuto" AllowPaging="True" >
                        <HeaderStyle font-size="small" font-bold="True" horizontalalign="Center" forecolor="MidNightBlue" backcolor="#B0C4DE"></HeaderStyle>
                        <AlternatingItemStyle font-size="Small" backcolor="White"></AlternatingItemStyle>
                        <ItemStyle font-size="Small"></ItemStyle>
                        <columns>
                            <asp:TemplateColumn HeaderText="Picture">
                                <ItemTemplate>
                                      THIS IS THE IMAGEBUTTON THAT WILL OPEN A WINDOW AND WILL PASS AN ARGUMENT TO THIS WINDOW WHEN THE USER PASS THE MOUSE OVER
                                    <asp:ImageButton Width="20" height="20" imageUrl="images/bouton.gif"  runat="server"></asp:ImageButton>
                                </ItemTemplate>
                            </asp:TemplateColumn>
                            <asp:TemplateColumn HeaderText="IdAuto">
                                <ItemTemplate>
                                    <asp:Label text='<%#Container.DataItem("IdAuto")%>' runat="server">Label</asp:Label>
                                </ItemTemplate>
                            </asp:TemplateColumn>
                            <asp:TemplateColumn HeaderText="Model">
                                <ItemTemplate>
                                    <asp:Label text='<%#Container.DataItem("Model")%>' runat="server">Label</asp:Label>
                                </ItemTemplate>
                            </asp:TemplateColumn>
                            <asp:TemplateColumn HeaderText="Year">
                                <ItemTemplate>
                                    <asp:Label text='<%#Container.DataItem("Year")%>' runat="server">Label</asp:Label>
                                </ItemTemplate>
                            </asp:TemplateColumn>
                            <asp:TemplateColumn HeaderText="Mileage">
                                <ItemTemplate>
                                    <asp:Label text='<%#Container.DataItem("Kilometers")%>' runat="server">Label</asp:Label>
                                </ItemTemplate>
                            </asp:TemplateColumn>
                            <asp:TemplateColumn HeaderText="Price">
                                <ItemTemplate>
                                    <asp:Label text='<%#Container.DataItem("Price") & "$" %>' runat="server">Label</asp:Label>
                                </ItemTemplate>
                            </asp:TemplateColumn>
                        </columns>
                    </asp:DataGrid>
                </SelectedItemTemplate>
                <ItemTemplate>
                    <asp:ImageButton CommandName="Select" ImageUrl="images/clickdown.gif" Width="16" Height="17" runat="server" AlternateText="Click to view adds" />
                    <asp:Label runat="server" text='<%# Container.dataitem("Make")%>'>Label</asp:Label>
                </ItemTemplate>
                <AlternatingItemStyle backcolor="White"></AlternatingItemStyle>
                <HeaderTemplate>
                    <b>Customer List</b>
                </HeaderTemplate>
            </asp:DataList>
        </div>
    </form>
</body>
</html>

Thanks in Advance
0
alain_matos
Asked:
alain_matos
  • 2
1 Solution
 
Elvio Lujan.Net Senior DeveloperCommented:
<asp:ImageButton onmouseover='javascript:window.open('xxx.aspx','')' Width="20" height="20" imageUrl="images/bouton.gif"  runat="server"></asp:ImageButton>
0
 
alain_matosAuthor Commented:
Thanks for your help
But What I want to pass a parameter to xxx.aspx for example I would like to pass it the IdAuto That is the DataKeyField of the datagrid

Regards
Alan
0
 
Elvio Lujan.Net Senior DeveloperCommented:
then
in the itemdatabound event...

ctype(e.item.cells(indexofcell).findcontrol("imagebuttonid"),ImageButton).attributes.add("onmouseover", "window.open('xxx.aspx?IdAuto="& dg.datakeys(e.item.itemindex) &"','')")

remember to verify if the item is and item or alternating item
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now