fancyboxjquery关于gridview的templete字段绑定问题
本文关键字:字段 绑定 问题 templete 关于 gridview fancyboxjquery | 更新日期: 2023-09-27 18:28:11
这里我在c#.net中创建了一个网站,我想要在单击fancybox中的gridview字段后打开的页面。但我面临的一个问题是,它打开了第一排fancybox中的页面,只是我不知道为什么。。?
这是我的代码:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="../fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="../fancybox/jquery.easing-1.3.pack.js"></script>
<script type="text/javascript" src="../fancybox/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript" src="../fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="../fancybox/jquery.fancybox-1.3.4.css"
media="screen" />
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$('#deal_VCU').fancybox({
'width': '85%',
'height': '85%',
'autoScale': false,
'transitionIn': 'none',
'transitionOut': 'none',
'type': 'iframe',
'titleShow': false
});
});
</script>
<asp:GridView ID="GrdDeals" runat="server" AllowPaging="True" AllowSorting="True"
AutoGenerateColumns="False" CellPadding="1" DataKeyNames="OFID" DataSourceID="SqlDataSource3"
ForeColor="#333333" GridLines="None" PageSize="100"
onrowdatabound="GrdDeals_RowDataBound" onrowcommand="GrdDeals_RowCommand">
<Columns>
<asp:BoundField DataField="OFID" HeaderText="Offer ID" SortExpression="OFID" />
<asp:BoundField DataField="Text_Message" HeaderText="Offer Text" SortExpression="Text_Message" />
<asp:TemplateField HeaderText="Deal for VCU" SortExpression="Counter1">
<ItemTemplate>
<a id="deal_VCU" href="DetailView.aspx?ID=<%#Eval("OFID")%>&Op1=Counter2">
<%#Eval("Counter2")%></a>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Deal for SCSU" SortExpression="Counter2">
<ItemTemplate>
<a id="deal_SCSU" href="DetailView.aspx?ID=<%#Eval("OFID")%>&Op1=Counter2">
<%#Eval("Counter2")%></a>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Deal for Trinity" SortExpression="Counter3">
<ItemTemplate>
<a id="deal_Trinity" href="DetailView.aspx?ID=<%#Eval("OFID")%>&Op1=Counter3">
<%#Eval("Counter3")%></a>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#EFF3FB" Height="4" />
<EditRowStyle BackColor="#2461BF" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Right" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
在这里,我面临的一个问题是,fancybox只在第一排开放。
这是因为存在多个具有相同ID
的超链接控件。请分配一个css类(比如deal_VCUCSS
)
<a id="deal_VCU" class="deal_VCUCSS" href="DetailView.aspx?ID=<%#Eval("OFID")%>&Op1=Counter2">
<%#Eval("Counter2")%></a>
并使用以下
$('.deal_VCUCSS').fancybox({
为了让jQuery选择器工作,他们需要知道你引用的是什么元素,而且由于你的代码有错误(根据W3C,在html文件中应该只使用一次ID,以便DOM元素知道你想访问什么元素)。
您需要有一个类,就像前面的注释中一样,才能有事件侦听器。或者,如果您希望每个链接都有不同的ID,那么您可以循环并将事件侦听器应用于所有链接$("#main_div_container").find("a").each(function(){您的代码在这里;});我希望这能有所帮助。