Gridview TemplateField中的Lightbox

时间:2012-12-17 13:03:38

标签: asp.net gridview lightbox

<script type="text/javascript">
        $(document).ready(function () {
          $("#LightBox").click(function () {
                $.fancybox.open({
                    href: ($('#LightBox').val()),
                    type: 'iframe',
                    padding: 7
                });
            });
        });
    </script>

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
                        DataSourceID="SqlDataSource1" >
                        <Columns>
                         <asp:TemplateField>
                         <ItemTemplate>
                         <asp:Button   ID="LightBox" runat="server" Text="http://www.apple.com/ipod" />
                         </ItemTemplate>
                         </asp:TemplateField>
                        </Columns>
   </asp:GridView>

如果我将Button放在gridview外面,Light-box工作正常..我不明白为什么它不会从templateField中触发。

1 个答案:

答案 0 :(得分:0)

可以尝试使用以下代码(使用类而不是ID)

<script type="text/javascript">
        $(document).ready(function () {
          $(".LightBox").click(function () {
                var url = $(this).val();
                $.fancybox.open({
                    href: url,
                    type: 'iframe',
                    padding: 7
                });
            });
        });
    </script>

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
                        DataSourceID="SqlDataSource1" >
                        <Columns>
                         <asp:TemplateField>
                         <ItemTemplate>
                         <asp:Button   ID="LightBox" CssClass="LightBox" runat="server" Text="http://www.apple.com/ipod" />
                         </ItemTemplate>
                         </asp:TemplateField>
                        </Columns>
   </asp:GridView>