需要为通过API生成的文件显示下载和删除按钮

Question

我尝试通过使用 API url 来显示包含项目列表的表格。除此之外，我还尝试添加下载和删除列。哪个应该在该表的每一行显示下载和删除按钮。

成功拉取表格形式的列表并显示在.aspx页面中。但未能显示下载和删除按钮。

下面是我到目前为止得到的输出。我的目标是在每一行获取下载和删除按钮。

protected async void Page_Load(object sender, EventArgs e)
    {
        
        if (!IsPostBack)
        {
            BindGridView1();
}
}

private void BindGridView1()
    {
        string apiUrl = "http://mesappbeta/BE_API_HOME/api/SeriesBlacklist/Req_UploadedDocs?series=AE01400&series_type=RU";
        using (var client = new HttpClient())
        {
            client.DefaultRequestHeaders.Accept.Add(new MediaTypeWithQualityHeaderValue("application/json"));
            HttpResponseMessage response = client.GetAsync(apiUrl).Result;
            if (response.IsSuccessStatusCode)
            {
                string json = response.Content.ReadAsStringAsync().Result;
                Root data = JsonConvert.DeserializeObject<Root>(json);

                DataTable dt = new DataTable();
                dt.Columns.Add("File Name");
                dt.Columns.Add("File Type");
                dt.Columns.Add("Uploaded Date");

                foreach (var item in data.data)
                {
                    DataRow row = dt.NewRow();
                    row["File Name"] = item.file_name;
                    row["File Type"] = item.file_type;
                    row["Uploaded Date"] = item.created_datetime;
                    dt.Rows.Add(row);
                }

                // Add TemplateField for Download button
                TemplateField downloadField = new TemplateField();
                downloadField.HeaderText = "Download";
                downloadField.ItemTemplate = new ButtonTemplate("Download", "<%# DownloadFile(HttpUtility.HtmlEncode(Container.DataItem[\"file_name\"].ToString())) %>");
                downloadField.ItemStyle.HorizontalAlign = HorizontalAlign.Center;
                GridView2.Columns.Add(downloadField);

                // Add TemplateField for Delete button
                TemplateField deleteField = new TemplateField();
                deleteField.HeaderText = "Delete";
                deleteField.ItemTemplate = new ButtonTemplate("Delete", "<%# DeleteFile(HttpUtility.HtmlEncode(Container.DataItem[\"file_name\"].ToString())) %>");
                deleteField.ItemStyle.HorizontalAlign = HorizontalAlign.Center;
                GridView2.Columns.Add(deleteField);

                GridView2.DataSource = dt;
                GridView2.DataBind();
            }
        }
    }

    protected void GridView2_RowCommand(object sender, GridViewCommandEventArgs e)
    {
        if (e.CommandName == "Download")
        {
            DownloadFile(e.CommandArgument.ToString());
        }
        else if (e.CommandName == "Delete")
        {
            DeleteFile(e.CommandArgument.ToString());
        }
    }

以下代码来自类文件

public class ButtonTemplate : ITemplate
{
    private string _buttonText;
    private string _clickMethod;        

    public ButtonTemplate(string buttonText, string clickMethod)
    {
        _buttonText = buttonText;
        _clickMethod = clickMethod;
    }

    public void InstantiateIn(Control container)
    {
        LinkButton btn = new LinkButton();
        btn.CommandName = "CustomCommand";
        btn.Text = _buttonText;
        btn.CommandArgument = _clickMethod;
        btn.ID = "lnkButton";
        btn.CssClass = "myButtonStyle"; // Add CSS class to the button
        container.Controls.Add(btn);
    }

下面是aspx文件中gridview的代码

<asp:GridView ID="GridView2" runat="server" OnRowDeleting="GridView2_RowDeleting" AutoGenerateColumns="true" OnRowCommand="GridView2_RowCommand">

Answer 1

在我看来，后面的代码添加列的有效案例很少。

既然你后面的代码是硬编码列名，那为什么不把这两个按钮添加到 GV 呢？

您可能会在代码中添加按钮（但您必须一直重新注入，没有自动视图状态），更糟糕的是，向这两个按钮添加点击事件会更加困难。

那么，为什么不放弃所有这些工作，而只是将 2 个按钮添加到 gv 标记中，然后就完成了呢？

例如这个标记：

<asp:GridView ID="GridView1" runat="server"
CssClass="table table-hover"
AutoGenerateColumns="false"
Width="45%">

<Columns>
<asp:BoundField DataField="Date" HeaderText="Date" ItemStyle-Width="100px" />
<asp:BoundField DataField="File Name" HeaderText="File Name" />
<asp:BoundField DataField="FullFile" HeaderText="Full File" />
<asp:BoundField DataField="File Size" HeaderText="Size" ItemStyle-Width="100px" />

<asp:TemplateField HeaderText="Download" ItemStyle-HorizontalAlign="Center">
    <ItemTemplate>
        <asp:Button ID="cmdDownLoad" runat="server" Text="DownLoad" CssClass="btn"
            OnClick="cmdDownLoad_Click" />
    </ItemTemplate>
</asp:TemplateField>

<asp:TemplateField HeaderText="Delete" ItemStyle-HorizontalAlign="Center">
    <ItemTemplate>
        <asp:Button ID="cmdDelete" runat="server" Text="Delete" CssClass="btn"
            OnClick="cmdDelete_Click" />
    </ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>

这里有更多的灵活性。

因此我们得到+看到这个：

还有大笔奖金？

然后单击事件变得非常容易拾取当前行。

说删除按钮代码：

    protected void cmdDelete_Click(object sender, EventArgs e)
    {
        Button cmdDel= (Button)sender;
        GridViewRow gRow = (GridViewRow)cmdDel.NamingContainer;

        Debug.Print($"Row index = {gRow.RowIndex.ToString()}");
        Debug.Print($"File name of this row = {gRow.Cells[1].Text}");
        // do whatever to delete here
    }

输出：

Row index = 3
File name of this row = dd.min.js

因此，目前尚不清楚当您不需要编写任何代码来将这两个按钮添加到列时，您是否有充分的理由编写所有代码。

另一大优势是您可以使用图片按钮，甚至可以根据需要使用引导程序图标。 （比如使用链接按钮）像这样：

但是，我们“享受”每一行的简单简按钮单击事件。

所以，目前还不清楚为什么存在为按钮和控件注入+编写代码的目标，您可以简单地将其拖放到该页面中。