通过 Button 触发 AsyncFileUpload 控件

发布于 2024-12-22 03:29:39 字数 1087 浏览 0 评论 0原文

我想通过页面中的另一个控件触发 AsnyncFileUpload 控件。

我使用了 ASP.NET AJAX 工具包中的 AsyncfileUpload 并通过 JQuery 隐藏了它。并在其旁边放置一个按钮。当我单击此按钮并选择一个文件时，我想触发 AsycnFileUpload 并上传文件。

我已经编写了大部分代码，但是当我选择文件时出现 Javascript 错误。

（错误：访问被拒绝；

地点：setTimeout(function () { mainForm.submit(); //这里出错； uploader._waitTimer = setTimeout(function () { uploader._wait() }, 100); }, 0);

<asp:Button ID="btnFileUpload" runat="server" Text="Add" onclientclick="FileUploadClick(); return false;"/>
<ajaxToolkit:AsyncFileUpload  runat="server" ID="AsyncFileUpload1" Width="400px" UploaderStyle="Modern" UploadingBackColor="#CCFFFF"/>

这是我的 Javascript（我看到了控件生成的标记并获取了文件输入通过附加“_ct102”进行输入）

function FileUploadClick() {
            var fileUploadControl = document.getElementById('<%= AsyncFileUpload1.ClientID %>' + '_ctl02')
            fileUploadControl.click();
            //fileUploadControl.setActive();                
        }

原文

I want to fire the AsnyncFileUpload control through another control in the page.

I have used AsyncfileUpload from ASP.NET AJAX toolkit and hidden it through JQuery. And places a button next to it. When even i click this button and select a file i want to fire the AsycnFileUpload and upload files.

I have written most of the code but i get an Javascript error when i select a file.

(ERROR: Access Denied;

PLACE: setTimeout(function () { mainForm.submit(); //Error here; uploader._waitTimer = setTimeout(function () { uploader._wait() }, 100); }, 0);

<asp:Button ID="btnFileUpload" runat="server" Text="Add" onclientclick="FileUploadClick(); return false;"/>
<ajaxToolkit:AsyncFileUpload  runat="server" ID="AsyncFileUpload1" Width="400px" UploaderStyle="Modern" UploadingBackColor="#CCFFFF"/>

And this is my Javascript (I saw the markup generated by the control and got the File input
type by appending "_ct102")

function FileUploadClick() {
            var fileUploadControl = document.getElementById('<%= AsyncFileUpload1.ClientID %>' + '_ctl02')
            fileUploadControl.click();
            //fileUploadControl.setActive();                
        }

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

揽月 2024-12-29 03:29:39

我对此进行了更多研究，发现这是不可能做到的。
由于安全原因，禁止从其他控件触发文件类型输入。所以这个是做不到的。

设置文件上传控件样式的唯一解决方法是将控件的不透明度设置为 0，并将控件置于该文件控件下方，并更改 HTML 中的 Z 索引。
事实上，这正是 AsyncFileUpload 控件所使用的技巧。

这是解释该技巧的链接
http://www.quirksmode.org/dom/inputfile.html

所以我应用了这个AsyncFileUpload 的技巧，它内部将其应用于 HTML 文件上传控件

谢谢大家

回复收藏 0 原文

嘿看小鸭子会跑 2024-12-29 03:29:39

解决上述问题的简单方法是添加 CSS，例如这将适用于所有浏览器。

<style type="text/css">
    .FileUploadClass input
    {
        width:100%!important; // mandatory
    }
</style>

<ajaxToolkit:AsyncFileUpload ID="asyncFileUpload" runat="server" CssClass="FileUploadClass" OnUploadedComplete="asyncFileUpload_UploadedComplete" UploaderStyle="Traditional"/>

Simple solution to the above problem is to add CSS for example this will work in all browsers.

<style type="text/css">
    .FileUploadClass input
    {
        width:100%!important; // mandatory
    }
</style>

<ajaxToolkit:AsyncFileUpload ID="asyncFileUpload" runat="server" CssClass="FileUploadClass" OnUploadedComplete="asyncFileUpload_UploadedComplete" UploaderStyle="Traditional"/>

回复收藏 0 原文

~没有更多了~