The following code is dynamic create dropdownmenu which data within pulled from database
However, the code work well on IE but not on Firefox. On Firefox, the whole mouseover and mouseout function din't work. what is not supported on Firefox? the javascript syntax? please help as i am not familiar with javascript. thanks in advanced. this is quite urgent.... please..
By the way hope there has somebody may help me find out why the design may not in proper way like in IE for Firefox. the padding and space between table and table all not in proper.... why is it happen? hope somebody may find out from HTML i provide here.
[HTML]
<script type="text/javascript">
function jshow(id, idname,imgid, imgidname)
{
var div = document.getEle mentById('div') ;
var child = div.childNodes;
var numchild = child.length;
var ctlname;
var obj;
var divimg = document.getEle mentById('divim g');
var childimg = divimg.childNod es;
var numchildimg = childimg.length ;
var ctlimgname;
var objimg;
for(var i = 0; i < numchild; i++)
{
ctlname = child[i].id;
if (ctlname.indexO f(idname) >= 0)
{
child[i].style.display = 'none';
}
}
for(var j = 0; j < numchildimg; j++)
{
ctlimgname = childimg[j].id;
if(typeof ctlimgname == 'string')
{
if (ctlimgname.ind exOf(imgidname) >= 0)
{
childimg[j].style.display = 'none';
}
}
}
obj = document.getEle mentById(id);
obj.style.displ ay = 'block';
objimg = document.getEle mentById(imgid) ;
objimg.style.di splay = 'block';
}
</script>
<div id="div">
<asp:DataList ID="dgUser" Width="748px" runat="server" RepeatDirection ="Horizontal " RepeatColumns=" 5" ItemStyle-VerticalAlign=" Top" cellspacing="0" cellpadding="0" ItemStyle-HorizontalAlign ="Left" >
<ItemTemplate >
<asp:Table runat="server" id="tblUser" style="display: block;cursor:po inter; width: 100%; font-family: Arial; font-size: 9pt; font-weight: 700; height: 30px;" cellspacing="0" cellpadding="0" >
<asp:TableRow Visible="false" >
<asp:TableCel l Width="100%">
<asp:Label ID="lblUserID" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTID")% >' ></asp:Label>
</asp:TableCell>
<asp:TableCel l Width="100%">
<asp:Label ID="lblBanner" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTImgGatewa y")%>' ></asp:Label>
</asp:TableCell>
<asp:TableCel l Width="100%">
<asp:Label ID="lblBannerUR L" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTGatewayUR L")%>' ></asp:Label>
</asp:TableCell>
</asp:TableRow>
<asp:TableRow ID="trCustTT" >
<asp:TableCel l id="tcCustTI" ColumnSpan="3">
<as p:LinkButton ID="lbCustTName " ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTName" )%>' CommandName ="SelectCustTyp e" CommandArgument ='<%#DataBinder .Eval(Container .DataItem, "CustTID")% >'></asp:LinkButton>
</asp:TableCell>
<asp:TableCel l Visible="false" Width="100%">
<asp:Label ID="lblimg" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTTabImg")% >' ></asp:Label>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>
<asp:PlaceHolde r ID="phAddress" runat="server" Visible="true">
</asp:PlaceHolder >
</div>
[/HTML]
However, the code work well on IE but not on Firefox. On Firefox, the whole mouseover and mouseout function din't work. what is not supported on Firefox? the javascript syntax? please help as i am not familiar with javascript. thanks in advanced. this is quite urgent.... please..
By the way hope there has somebody may help me find out why the design may not in proper way like in IE for Firefox. the padding and space between table and table all not in proper.... why is it happen? hope somebody may find out from HTML i provide here.
Code:
Private Sub fnBindDataUser()
Dim conn As SqlConnection
Dim ds As DataSet
conn = New SqlConnection(ConfigurationManager.AppSettings("ConnectionStringTest"))
conn.Open()
Try
ds = SqlL.ExecuteDataset(conn, CommandType.Text, "SELECT * FROM tblCT")
[B]fnCreateAddressDataGrid(ds)[/B]
Catch ex As Exception
clsCommon.MsgBox(Me, "Message", ex.Message & " msg3")
ds = Nothing
Finally
conn.Close()
End Try
dgUser.DataSource = ds
dgUser.DataBind()
dgUser.Font.Underline = False
End Sub
Private Sub fnCreateAddressDataGrid(ByVal dsUser As DataSet)
Dim dr As DataRow
Dim boldisp As Boolean
Dim bolbgimg As Boolean
boldisp = False
bolbgimg = False
For Each dr In dsUser.Tables(0).Rows
Dim I As Integer = 0
Dim dgAddress As New DataList
Dim col As BoundColumn = New BoundColumn()
Dim tcl1 As TemplateColumn = New TemplateColumn()
Dim tcl2 As TemplateColumn = New TemplateColumn()
dgAddress.ID = "dgAddress_" & dr("CustTID").ToString
'Image
Dim btnImg As Image = New Image
Dim aImg As HtmlAnchor = New HtmlAnchor
Dim tblItem As Table = New Table
Dim tr As TableRow = New TableRow
Dim tc As TableCell = New TableCell
btnImg.ID = "bntImgAddress_" & dr("CustTID").ToString
aImg.ID = "aImgAddress_" & dr("CustTID").ToString
' aImg.HRef = "products/product.aspx?CID=" & CID & "&cuid=" & dr("CustTID").ToString 'dr("CustTGatewayURL").ToString
aImg.HRef = dr("CustTGatewayURL").ToString
aImg.Target = "_blank"
btnImg.ImageUrl = dr("CustTImgGateway").ToString
aImg.Controls.Add(btnImg)
If boldisp = False Then
dgAddress.Attributes.Add("style", "display:block")
tblItem.Attributes.Add("style", "display:block")
aImg.Style.Value = "display:block"
boldisp = True
Else
dgAddress.Attributes.Add("style", "display:none")
tblItem.Attributes.Add("style", "display:none")
aImg.Style.Value = "display:none"
End If
col.HeaderText = "Address"
col.DataField = "Address"
dgAddress.ItemTemplate = New CreateItemTemplateLinkBtn("lnkBtn", "Message", "doLink", "lblCustTID", bolbgimg, "lblnew")
If bolbgimg = False Then
bolbgimg = True
Else
bolbgimg = False
End If
AddHandler dgAddress.ItemDataBound, AddressOf dgAddress_ItemDataBound
AddHandler dgAddress.ItemCommand, AddressOf dgAddress_ItemCommand
dgAddress.DataSource = fnBindDataAddress(dr("CustTID").ToString)
dgAddress.DataBind()
dgAddress.Width = "748"
dgAddress.Height = "82"
dgAddress.ItemStyle.Width = "155"
dgAddress.ItemStyle.Wrap = True
dgAddress.ItemStyle.VerticalAlign = VerticalAlign.Top
dgAddress.ItemStyle.HorizontalAlign = HorizontalAlign.Left
dgAddress.Font.Name = "Arial"
dgAddress.Font.Size = "8"
dgAddress.RepeatLayout = RepeatLayout.Table
dgAddress.RepeatDirection = RepeatDirection.Horizontal
dgAddress.RepeatColumns = 5
dgAddress.CellPadding = "0"
dgAddress.CellSpacing = "0"
dgAddress.Style.Value = "text-align:top;"
Dim arrColor() As String
arrColor = Split(dr("CustTTabColor").ToString, ",")
tblItem.BackColor = System.Drawing.Color.FromArgb(arrColor(0), arrColor(1), arrColor(2))
tblItem.ID = "tblItem" & dr("CustTID").ToString
tc.Controls.Add(dgAddress)
tr.Controls.Add(tc)
tblItem.Controls.Add(tr)
tr.Width = "748"
tr.Height = "80"
tr.Style.Value = "vertical-align:top;text-align:top;"
tblItem.CellPadding = "0"
tblItem.CellSpacing = "0"
phAddress.Controls.Add(tblItem)
phBannerImg.Controls.Add(aImg)
Next
End Sub
Protected Sub dgUser_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataListItemEventArgs) Handles dgUser.ItemDataBound
If e.Item.ItemType = ListItemType.AlternatingItem Or e.Item.ItemType = ListItemType.Item Then
Dim tblUser As Table = CType(e.Item.FindControl("tblUser"), Table)
Dim lblUserID As Label = CType(e.Item.FindControl("lblUserID"), Label)
Dim lnkCustType As LinkButton = CType(e.Item.FindControl("lbCustTypeName"), LinkButton)
[B] tblUser.Attributes.Add("onmouseover", "jshow( 'tblItem" & lblUserID.Text & "','tblItem','aImgAddress_" & lblUserID.Text & "','aImgAddress_');") [/B]
[B] tblUser.Attributes.Add("onmouseout", "jshow( 'tblItem" & lblUserID.Text & "','tblItem','aImgAddress_" & lblUserID.Text & "','aImgAddress_');")[/B] tblUser.BackImageUrl = CType(e.Item.FindControl("lblimg"), Label).Text
End If
End Sub
<script type="text/javascript">
function jshow(id, idname,imgid, imgidname)
{
var div = document.getEle mentById('div') ;
var child = div.childNodes;
var numchild = child.length;
var ctlname;
var obj;
var divimg = document.getEle mentById('divim g');
var childimg = divimg.childNod es;
var numchildimg = childimg.length ;
var ctlimgname;
var objimg;
for(var i = 0; i < numchild; i++)
{
ctlname = child[i].id;
if (ctlname.indexO f(idname) >= 0)
{
child[i].style.display = 'none';
}
}
for(var j = 0; j < numchildimg; j++)
{
ctlimgname = childimg[j].id;
if(typeof ctlimgname == 'string')
{
if (ctlimgname.ind exOf(imgidname) >= 0)
{
childimg[j].style.display = 'none';
}
}
}
obj = document.getEle mentById(id);
obj.style.displ ay = 'block';
objimg = document.getEle mentById(imgid) ;
objimg.style.di splay = 'block';
}
</script>
<div id="div">
<asp:DataList ID="dgUser" Width="748px" runat="server" RepeatDirection ="Horizontal " RepeatColumns=" 5" ItemStyle-VerticalAlign=" Top" cellspacing="0" cellpadding="0" ItemStyle-HorizontalAlign ="Left" >
<ItemTemplate >
<asp:Table runat="server" id="tblUser" style="display: block;cursor:po inter; width: 100%; font-family: Arial; font-size: 9pt; font-weight: 700; height: 30px;" cellspacing="0" cellpadding="0" >
<asp:TableRow Visible="false" >
<asp:TableCel l Width="100%">
<asp:Label ID="lblUserID" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTID")% >' ></asp:Label>
</asp:TableCell>
<asp:TableCel l Width="100%">
<asp:Label ID="lblBanner" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTImgGatewa y")%>' ></asp:Label>
</asp:TableCell>
<asp:TableCel l Width="100%">
<asp:Label ID="lblBannerUR L" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTGatewayUR L")%>' ></asp:Label>
</asp:TableCell>
</asp:TableRow>
<asp:TableRow ID="trCustTT" >
<asp:TableCel l id="tcCustTI" ColumnSpan="3">
<as p:LinkButton ID="lbCustTName " ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTName" )%>' CommandName ="SelectCustTyp e" CommandArgument ='<%#DataBinder .Eval(Container .DataItem, "CustTID")% >'></asp:LinkButton>
</asp:TableCell>
<asp:TableCel l Visible="false" Width="100%">
<asp:Label ID="lblimg" ForeColor="Whit e" runat="server" Text='<%#DataBi nder.Eval(Conta iner.DataItem, "CustTTabImg")% >' ></asp:Label>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>
<asp:PlaceHolde r ID="phAddress" runat="server" Visible="true">
</asp:PlaceHolder >
</div>
[/HTML]
Comment