0

DataGridを使用してデータベースから取得したデータを表示していますが、Javascriptを使用してグリッドのItemCommandイベントを発生させることができるかどうか疑問に思っていました。

以下のスニペットは、DIVremoveProductButtonのonclickハンドラー内で実行しようとしていることを大まかに示しています。現在、DIVのルックアンドフィールはCSSを使用して制御されており、クリック可能なトリガーの作成に使用されるHTML要素のタイプに関係なくコードが機能するため、asp：Buttonまたはasp：LinkBut​​tonを使用したくありません。ルックアンドフィールのカスタマイズ。

<asp:datagrid id="itemGrid" runat="server" cellPadding="0" AutoGenerateColumns="False" GridLines="None">
    <Columns>
        <asp:TemplateColumn>
            <ItemTemplate>
                <div class="items">
                    <div class="product_title"><%#Eval("ItemID")%>.&nbsp;<%#Eval("ItemDescription")%></div>
                    <div class="product_image">
                        <img id="productImage_<%#Eval("ItemID")%>" src="<%#Eval("ThumbnailURL")%>" />
                    </div>
                    <div class="buttons">
                        <div id="removeProductButton" class="buttonStandard" onclick="Do Something HERE...">Remove</div>
                    </div>
                </div>
            </ItemTemplate>
        </asp:TemplateColumn>
    </Columns>
</asp:datagrid>

グリッドのItemCreatedイベントで次のコードを使用しようとしましたが、機能させることができませんでした

private void itemGrid_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item ||
        e.Item.ItemType == ListItemType.AlternatingItem)
    {
        dynamic itemData = e.Item.DataItem;

        HtmlGenericControl removeProductButton = (HtmlGenericControl)e.Item.FindControl("removeProductButton");

        removeProductButton.Attributes.Add("onclick", ClientScript.GetPostBackEventReference(removeProductButton, ""));
    }
}

どんな助けでも大歓迎です。

4

1 に答える 1

0

目的のCommandNameを使用してItemTemplateに非表示のボタンを追加します。

<asp:Button 
    ID="removeProductButton_hidden" 
    runat="server" 
    style="display:none;" 
    CommandName="YourCommandName" 
    Text="" />

'Remove'divにrunat="server"属性があることを確認してください。

<div ID="removeProductButton" runat="server" class="buttonStandard">Remove</div>

グリッドItemCreatedハンドラーを取り除き、次のようなグリッドItemDataBoundハンドラーを作成します。

public void grd_ItemDataBound(object sender, DataGridItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        HtmlGenericControl removeProductButton = (HtmlGenericControl)e.Item.FindControl("removeProductButton");

        Button removeProductButtonHidden = (Button)e.Item.FindControl("removeProductButton_hidden");

        removeProductButton.Attributes.Add("onclick", ClientScript.GetPostBackEventReference(removeProductButtonHidden, ""));
    }
}

したがって、グリッド定義全体は次のようになります。

<asp:DataGrid 
    runat="server" 
    ID="itemGrid" 
    OnItemCommand="itemGrid_ItemCommand" 
    OnItemDataBound="itemGrid_ItemDataBound">
    <Columns>
        <asp:TemplateColumn>
            <ItemTemplate>
                <asp:Button 
                    ID="removeProductButton_hidden" 
                    runat="server" 
                    style="display:none;" 
                    CommandName="YourCommandName" 
                    Text="" />
                <div class="items">
                    <div class="buttons">
                        <div ID="removeProductButton" runat="server" class="buttonStandard">Remove</div>
                    </div>
                </div>
            </ItemTemplate>
        </asp:TemplateColumn>
    </Columns>
</asp:DataGrid>
于 2012-04-16T22:15:35.467 に答える