0

使用asp:FileUpload控件浏览和上传工作得很好。
但这是两步过程。首先我们必须浏览然后选择文件。

我希望它单步工作所以为了使它单步运行，我尝试了以下代码： 

protected void Button1_Click(object sender, EventArgs e)
{
    //to launch the hidden fileupload dialog
    ClientScript.RegisterStartupScript (GetType(),
"hwa", "document.getElementById('fileupload').click();", true);

    //Getting the file name
    if (this.fileupload.HasFile)
    {
        string filename = this.fileupload.FileName;

        ClientScript.RegisterStartupScript(GetType(), "hwa", "alert('Selected File: '" + filename + ");", true);
    }
    else 
    {
        ClientScript.RegisterStartupScript(GetType(), "hwa", "alert('No FILE has been selected');", true);
    }

}



在此代码中，有一个fileUpload控件正在被调用Button1_Click。
理想情况下，它应该执行第一行，然后应该显示文件上传控件，在选择文件或取消对话框后，流程应该转到下一行。但是在完整功能执行完成后会显示对话框。
由于这种异步或非预期的执行流程if (this.fileupload.HasFile)返回错误（因为尚未要求用户选择任何文件）并且我没有获得所选文件名。

我们可以修改此代码以实现单步上传文件吗？或者是否有任何其他方式可以做到这一点？

注意-我已要求不要使用window formsand Threads。因此，使用这两个解决方案是不可接受的。

4

4 回答 4

1

这不完全是您正在寻找的东西，但它可以满足您的需求。不同之处在于，您必须单击该按钮，而不是单击单独的Browse按钮。当您按下Open按钮时，页面将回发。我为此使用了 JQuery。这是我的代码

ASPX

<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.9.1.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:FileUpload ID="fileupload1" runat="server" />
        <asp:Button ID="btn" runat="server" OnClick="btn_Click" Text="upload" style="display:none" />
    </div>
    <script type="text/javascript">
        var isfirst = true;
        $(function () {

            $('#<%= fileupload1.ClientID %>').on('change', function (e) {
                console.log('change triggered');
                $('#<%= btn.ClientID%>').trigger('click'); // trigger the btn button click which i have hidden using style='display:none'
            });
        });

    </script>
    </form>
</body>

背后的代码

protected void btn_Click(object sender, EventArgs e)
{
    //TODO 
}
于 2013-04-08T12:30:11.290 回答
1

您错过了在 Web 环境中存在客户端/服务器端断开连接的事实。

您的行：ClientScript.RegisterStartupScript (GetType(),"hwa","document.getElementById('fileupload').click();", true);是客户端代码，直到服务器端脚本完成并且生成的 HTML/javascript/CSS 将返回到浏览器，因为它是客户端 javascript 才会执行。您想利用onchange文件上传控件的事件。

这个问题应该可以帮助您：ASP.NET FileUpload：选择文件后如何自动回发？

于 2013-04-08T12:11:57.120 回答
0

对于迟到的人来说，

    <div>
        <asp:FileUpload ID="fu" runat="server"  CssClass="bbbb" onchange="clickSeverControl()"/>
        <asp:LinkButton Text="Upload" ID="lnkUpload" runat="server" OnClientClick="showUpload();return false;" OnClick="lnkUpload_Click"/>
    </div>

用css隐藏文件控件

    <style>
    .hiddenStyle {
        visibility:hidden;            
    }
    </style>

客户端点击链接按钮事件触发文件上传控件点击

    function showUpload() {
        document.getElementById("fu").click();
    }

在更改事件触发服务器端单击

    function clickSeverControl() {

        __doPostBack('<%= lnkUpload.ClientID %>', 'OnClick');
    }

在服务器上单击保存上传的文件

    protected void lnkUpload_Click(object sender, EventArgs e)
    {
        fu.PostedFile.SaveAs(Server.MapPath("~/Upload") + "/" + fu.PostedFile.FileName);
    }
于 2014-04-06T18:25:56.170 回答
0

感谢其他答案我刚刚结合了两个示例并在我的项目中找到了我的问题的解决方案

<head runat="server">
    <title></title>
<script src="Scripts/jquery-1.9.1.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
    <asp:FileUpload ID="fileupload1" runat="server" />
    <asp:Button ID="btnUploadBulk" runat="server" OnClick="btn_Click" Text="upload" style="display:none" />
</div>
<script type="text/javascript">
    var isfirst = true;
    $(function () {
        $('#<%= btnUploadBulk.ClientID%>').on('click', function (e) {
            showUpload();
        })
        });
    function showUpload() {
        var control = document.getElementById("<%= FileUploadControl.ClientID %>");
        control.click();
    }

</script>
</form>

代码背后

protected void btn_Click(object sender, EventArgs e)
{
    //TODO 
}

这对我有用

于 2015-03-11T12:34:22.197 回答