Как изменить GridView значение ячейки с JavaScript

Question

У меня есть создать GridView следующим образом:

<asp:GridView ID="Grid1" runat="server" CellPadding="1" ClientIDMode="Static" AutoGenerateColumns="false" ShowHeader="true"> 
     <Columns> 
      <asp:TemplateField headertext="ColumnA"> 
       <ItemTemplate> 
        <asp:label id="ColumnA" Text='<%#Eval("ColumnA")%>' runat="server"/> 
       </ItemTemplate> 
      </asp:TemplateField> 

     </Columns> 
    </asp:GridView> 

Как я могу добавить событие щелчка (на этикетке) и изменить значение ячейки (что нажата) в javascript? Я пробовал различные способы использования jquery, но ни один из них не работает должным образом, надеюсь, вы можете мне помочь в этом. Благодарю.

Answer 1

Как насчет установки class на ваш ярлык и применения class selector в jQuery. Затем вы можете просто получить доступ к содержимому метки, чтобы создать новое значение без необходимости уникального идентификатора строки.

<asp:GridView ID="Grid1" runat="server" // DataSource="<%# DataItems %>" 
    CellPadding="1" ClientIDMode="Static" AutoGenerateColumns="false" ShowHeader="true"> 
    <Columns> 
     <asp:TemplateField headertext="ColumnA"> 
      <ItemTemplate> 
       <asp:label CssClass="ColumnA" Text='<%#Eval("ColumnA")%>' runat="server"/> 
      </ItemTemplate> 
     </asp:TemplateField> 

    </Columns> 
</asp:GridView> 

<script> 
    $("#Grid1 .ColumnA").click(function() { 
     var content = $(this).html(); 
     $(this).html(content + " Changed"); 
    }); 
</script> 

Если у вас есть необходимость, то вы можете также хранить некоторые дополнительные (например, уникальный идентификатор) информацию в data-* Attributes:

<asp:label data-id='<%#Eval("UniqueIdDataForClickEvent")%>' CssClass="ColumnA" Text='We have no actual data' runat="server"/> 

... 

<script> 
    $("#Grid1 .ColumnA").click(function() { 
     var content = $(this).data("id"); 
     $(this).html("We had unique id " + content); 
    }); 
</script>