调用按钮单击gridview内的文件上传

Posted 2023-04-12

【中文标题】调用按钮单击gridview内的文件上传

【英文标题】：Calling button click on file upload inside gridview

【发布时间】：2018-06-27 22:00:10

【问题描述】：

我正在尝试在gridview 中上传“Fileupload”控件的文件onchange 事件。 意味着当用户上传文件时，我需要将文件内容保存在数据库中。 所以，我在文件上传控件的变化上手动调用了按钮控件的点击事件，但是它抛出了像“无效的回发或回调参数......”这样的异常。

我的网格视图代码：

<asp:GridView runat="server" ID="grd" AutoGenerateColumns="false">
    <Columns>
        <asp:BoundField DataField="StudentID" HeaderText="Student ID" />
        <asp:BoundField DataField="StudentName" HeaderText="Name" />
        <asp:TemplateField HeaderText="Upload">
            <ItemTemplate>
                <asp:FileUpload ID="FileUpload1" runat="server" EnableViewState="true" onChange="FileUploadCall(this)" />
                <asp:Button ID="btnUpload" Text="Upload" runat="server" OnClick="Upload" Style="display: none" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

我的脚本代码：

<script type="text/javascript">
    function FileUploadCall(fileUpload) 
        if (fileUpload.value != '') 
            var a = $('#<%=grd.ClientID %>').find('[id*="btnUpload"]');
            a.click();
        
    
</script>

在cs文件中手动创建我的隐藏按钮：

protected void Upload(object sender, EventArgs e)

    Button btn = sender as Button;
    GridViewRow gvr = (GridViewRow)btn.Parent.Parent;

    FileUpload lbleno = (FileUpload)gvr.FindControl("FileUpload1");

    lbleno.SaveAs(Server.MapPath("~/Uploads/" + Path.GetFileName(lbleno.FileName)));
    //lblMessage.Visible = true;

【参考方案1】：

您获取上传按钮的 jquery 代码可能是原因。

由于您说您使用的是网格视图，因此可能有多行，每行都有自己的文件上传和按钮控件。您需要在网格视图中获取与该行关联的按钮控件。要获取关联的按钮，您应该使用如下所示的 jquery 代码，因为关联的按钮紧跟在文件上传控件之后。

if (fileUpload.value != '') 
    var a = $(fileUpload).next("[id*='Button1']");
    a.click();
  

【讨论】：

谢谢。但是，它没有显示按钮。 & 控制台我什么也没得到。

不显示按钮是什么意思？我从您的问题中假设该按钮正在显示。

【参考方案2】：

最简单的方法是从后面的代码中分配onchange 事件，这样您就可以轻松获得正确的按钮。所以为 GridView 创建一个RowDataBound 事件。

<asp:GridView ID="grd" runat="server" OnRowDataBound="grd_RowDataBound">

然后在 RowDataBound 方法中，使用 FindControl 定位并转换 FileUpload 和 Button。在方法中可以指定change事件触发对应按钮的PostBack。

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)

    //check if the row is a datarow
    if (e.Row.RowType == DataControlRowType.DataRow)
    
        //use findcontrol to locate the controls in the row and cast them
        Button btn = e.Row.FindControl("btnUpload") as Button;
        FileUpload fu = e.Row.FindControl("FileUpload1") as FileUpload;

        //assign the button postback to the change of the fileupload
        fu.Attributes.Add("onchange", "__doPostBack('" + btn.UniqueID + "','')");
    

【讨论】：

但没有结果。因为和绑定时间有关，所以我们需要自己上传文件。

但是 FileUpload 没有点击事件。这就是为什么您需要一个相应的按钮。并且onchange设置为fileupload，它只触发按钮点击。\

【参考方案3】：

你的实现很好，只是改变：

a.click(); => a[0].click();  //important!!

我希望回发中没有发生绑定：

if (!IsPostBack)

    var list = new List<Student>();
    list.Add(new Student() StudentID = 1, StudentName = "111");
    list.Add(new Student() StudentID = 2, StudentName = "222");
    grd.DataSource = list;
    grd.DataBind();

我已经测试过它完全可以正常工作！