在gridview标签鼠标悬停中调用jquery对话框

时间:2013-08-28 11:06:45

标签: jquery asp.net gridview

如何通过鼠标悬停从ASP.NET gridview标签触发jQuery对话框? 我尝试了这个,但它不起作用:

ASP加价

 <asp:GridView ID="gvMain2" runat="server">
   <Columns>
     <asp:TemplateField>
       <ItemTemplate>
          <table class="tg-table-plain" style="width:100%">
             <tr>
                 <td><asp:Label ID="GRID_LBL" class="GRID_LBL" 
                      runat="server" Text='<%# Eval("Some_text") %>'></asp:Label>
                 </td>
             </tr>
          </table>
       </ItemTemplate>
     </asp:TemplateField>
   </Columns>
</asp:GridView>

的JavaScript

$(function () {
    $("#dialog").dialog({
        autoOpen: false,
        show: {
            effect: "blind",
            duration: 1000
        },
        hide: {
            effect: "explode",
            duration: 1000
        }
    });

    $("#GRID_LBL").hover(function () {
        $("#dialog").dialog("open");
    });
});

3 个答案:

答案 0 :(得分:0)

如果该标签存在于gridview的每一行中,那么你不能给它们所有的相同的ID,你需要在列模板中将ASP类的标签设置为“GridLabel”,然后在jQuery代码中会像其他人一样将悬停效果附加到所有标签上

$(".GridLabel").hover(function () {
    $("#dialog").dialog("open");
});

答案 1 :(得分:0)

希望您已将下面的脚本添加到您的头脑中

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

希望您只有一个标识为GRID_LBL

的Gridview标签

这是工作DEMO

答案 2 :(得分:0)

问题是GRID_LBL不是生成代码中标签的ID,因为ASP.NET会生成自己的ID。由于此标签位于GridView内,因此在Javascript中设置ClientIDMode或编写ClientID将无效。您应该使用类而不是ID,生成的代码中的类是相同的:

<asp:Label ID="GRID_LBL" CssClass="GRID_LBL_CLASS"
                      runat="server" Text='<%# Eval("Some_text") %>'></asp:Label>

   $(".GRID_LBL_CLASS").hover(function () {
       $("#dialog").dialog("open");
   });