如何将jQuery UI按钮应用于ASP.NET中的html按钮？

我有一个名为btnShowTradeScreenshot的按钮的GridView。 GridView创建了很多按钮，我想将jQuery按钮应用到它。这里是我的相关的GridView代码：如何将jQuery UI按钮应用于ASP.NET中的html按钮？

<asp:GridView 
    ID="grdTrades" 
    runat="server" 
    >    
    <Columns>    
     <asp:TemplateField HeaderText="Screenshot" > 
      <ItemTemplate> 
       <input name="btnShowTradeScreenshot" runat="server" visible='<%# Eval("screenshotId") != DBNull.Value %>' type="button" value='View...' onclick='<%# "ShowImageInNewPage(\"App_Handlers/ImageHandler.ashx?screenshotId=" + Eval("screenshotId") + "\")" %>' /> 
      </ItemTemplate> 
     </asp:TemplateField>    
    </Columns> 
</asp:GridView>

我想使用此代码申请了jQuery：

<script type="text/javascript"> 
    $(document).ready(function() { $("#<%= btnShowTradeScreenshot.ClientID %>").button(); }); 
</script>

什么也没有发生，我得到的标准按钮，而不是jQuery的按钮。当我看着页面的源代码，我注意到按钮具有错位的名称，如：

ctl00$contentMain$grdTrades$ctl05$ctl03

ctl00$contentMain$grdTrades$ctl10$ctl03 等

如何jQuery的适用于我的所有按钮的任何想法？

谢谢。

来源

2010-11-19 Mark Allison

您可以在按钮上使用类名而不是依赖于ClientID;这样你节省了JavaScript的长度，并且不需要绑定到每个特定的控件。

在JS：

// equivalent to $(document).ready(function() { 
$(function() { 
    $('.customButton').button(); 
});

在ASP.NET：

<input type="button" runat="server" class="customButton" .../>

另外，如果您的网格是一个Ajax绑定网格，<input/>元素将被重新创建你需要重新运行网格上的代码以应用样式：

$('#<%= grdTrades.ClientID %> .customButton').button();

来源

2010-11-19 13:33:46

非常感谢。 – 2010-11-19 13:46:48

尝试使用名称选择器代替：

$('input[name$=btnShowTradeScreenshot]').button();

甚至更好的应用CSS类的输入，然后：

$('.button').button();

来源

2010-11-19 13:35:23

有许多按钮创建和ASP会产生不同的ID为他们，以确保每个人都有一个唯一的ID 。由于$（'＃...'）旨在选择一个唯一标识的元素，因此不能用它来选择多个按钮。

尝试$（'：button'）来选择所有按钮对象。或者，您可以将每个按钮的类设置为ShowTradeScreenshot，然后使用$（'.ShowTradeScreenshot'）选择它们。

来源

2010-11-19 13:38:26 sh54

如何将jQuery UI按钮应用于ASP.NET中的html按钮？

回答

相关问题