2

これらの操作を検討してください -

  1. ファイルのリストをDataListにバインドします。
  2. ユーザーが削除 LinkBut​​ton をクリックしたら、ItemCommandEventファイルを削除します 。
  3. データ全体を再バインドするのは非効率的であるため、削除された行を単純に非表示にしています。

次のコードは、ファイルを DataList に表示します。各行の横に削除ボタンがあります。

<asp:DataList ID="DataList1" OnItemCommand="DataList1_ItemCommand" runat="server">                
    <ItemTemplate>        
        <tr>
            <asp:Label Text='<%# Eval("ContainingFolder") as string + "\\" + Eval("FileName") as string %>' 
                Visible="false" ID="lblFullPath" runat="server" />
            <td><%# Eval("FileName") %></td>
            <td><%# Eval("ContainingFolder") %></td>
            <td><%# Eval("FileSize") %></td>
            <td><%# Eval("Modified") %></td>
            <td>
                <asp:LinkButton Text="Delete" ID="linkDelete" runat="server" />
            </td>
        </tr>            
    </ItemTemplate>
</asp:DataList>

ItemCommand イベント ハンドラーでは、このコードは選択されたファイルをこのリストから削除します。

protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
{
    if (e.Item.ItemType != ListItemType.Item && e.Item.ItemType != ListItemType.AlternatingItem) return;

    var selectedItem = e.Item.FindControl("lblFullPath") as Label;

    e.Item.Visible = false;       //doesn't work     

    File.Delete(selectedItem.Text);
}

ただし、 e.Item.Visible = falseは行を非表示にしません。ここにある回避策として、データリストで項目を非表示にする方法

プレースホルダー コントロール内にコンテンツをラップしました。

<ItemTemplate>
    <asp:PlaceHolder ID="ph1" runat="server">
        <%--wrapped content--%>
    </asp:PlaceHolder>
</ItemTemplate>

そして、プレースホルダー コントロールを非表示にします -

protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
{
    if (e.Item.ItemType != ListItemType.Item && e.Item.ItemType != ListItemType.AlternatingItem) return;

    var selectedItem = e.Item.FindControl("lblFullPath") as Label;
    //e.Item.Visible = false;
    e.Item.FindControl("ph1").Visible = false;
    File.Delete(selectedItem.Text);
}

一般に、asp.net で親コントロールを非表示にすると、そのすべての子コントロールが非表示になります。

理解できないのですが、

DataList の場合、親コントロール e.Item を非表示にしても、それを含む要素が非表示にならないのはなぜですか? あなたがアドバイスしていただけますか。

ご協力ありがとうございました。

編集: DataList に表示するファイルのリストの生成に関する詳細情報を更新します。

  • ボタンのクリック時に実行時に fileList を生成します。現在、このリストは永続的ではありません。
protected void btnFindDuplicates_Click(object sender, EventArgs e)
{
    DataList1.DataSource = FindDuplicates();
    DataList1.DataBind();
}
  • delete Click のイベント ハンドラで、削除操作が正常に完了しました。
  • したがって、削除されたアイテムをページから削除するだけで、dataSource を再生成してこれをバインドするのは賢明ではありません。隠すことは私にはより論理的に思えます。
4

1 に答える 1

1

JQuery と PageMethods を使用して、このサンプルを作成しました。

結果

ここに画像の説明を入力

ASPX

<script>
    $(function () {
        var $list = $("table[id*=myDataListID]");
        var $buttons = $("input:submit[id*=remove]", $list);

        $buttons.click(function (e) {
            e.preventDefault();

            if (!confirm("Are you sure?")) {
                return false;
            }

            var $self = $(this);
            var $jobID = $self.closest("tr").children().find("span[id*=jobID]");

            $buttons.prop("disabled", true);

            $.ajax({
                url: "<%: this.ResolveClientUrl("~/Topics/JQuery/Ajax/RemoveRowUsingJQueryAfterCallingService.aspx/Remove") %>",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                data: "{id: " + $jobID.text() + "}",
                async: true,
                cache: false,
                success: function () {
                    $buttons.prop("disabled", false);
                    $self.closest("tr").remove();
                },
                error: function (XHResponse, errorMessage, errorCode) {
                    $buttons.prop("disabled", false);
                    alert(errorMessage);
                }
            });
        });
    });
</script>

<asp:DataList runat="server" DataKeyField="job_id" DataSourceID="lds" ID="myDataListID">
    <HeaderTemplate>
        <tr>
            <th>
                &nbsp;
            </th>
            <th>
                ID
            </th>
            <th>
                Name
            </th>
        </tr>
    </HeaderTemplate>
    <ItemTemplate>
        <tr>
            <td>
                <asp:Button Text="Remove" runat="server" ID="remove" />
            </td>
            <td>
                <asp:Label Text='<%# Eval("job_id") %>' runat="server" ID="jobID" />
            </td>
            <td>
                <asp:Label ID="jobDesc" Text='<%# Eval("job_desc") %>' runat="server" />
            </td>
        </tr>
    </ItemTemplate>
</asp:DataList>

コードビハインド

[WebMethod]
public static void Remove(Int16 id)
{
    // simulate deleting the file
    Thread.Sleep(3000);
}

完全な動作例を GitHub サイトにアップロードしました

于 2012-10-07T09:25:56.950 に答える