隐藏已删除的行,从DataList中重新绑定DataSource

时间:2012-10-07 07:24:14

标签: c# asp.net

请考虑这些操作 -

  1. 绑定 DataList
  2. 中的文件列表
  3. 用户点击删除 LinkBut​​ton 后,删除该文件 的 ItemCommandEvent 即可。
  4. 由于重新绑定整个数据效率低下,我只是隐藏了 已删除的行。
  5. 以下代码显示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 不会隐藏该行。 作为此处的解决方法,How to hide an item in datalist

    我已将内容包装在占位符控件中。

    <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中隐藏父控件会隐藏其所有子控件。

    但我无法理解,

      

    为什么隐藏父控件e.Item不会隐藏其包含   元素,如果是DataList?你能给些建议么。

    感谢您的帮助。

    编辑:更新有关生成要在DataList中显示的文件列表的详细信息。

    • 在按钮单击时在运行时生成fileList,此列表不是 持久的,目前。
    protected void btnFindDuplicates_Click(object sender, EventArgs e)
    {
        DataList1.DataSource = FindDuplicates();
        DataList1.DataBind();
    }
    
    • 在删除Click的事件处理程序中,删除操作已经完成 成功完成。
    • 因此,只是要从页面中删除已删除的项目,这是不明智的 重新生成dataSource并绑定它。隐藏似乎对我更合乎逻辑。

1 个答案:

答案 0 :(得分:1)

我使用JQuery和PageMethods创建了这个示例:

结果

enter image description here

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);
}

I just uploaded the full working example to my GitHub site