ASP.net FileUploader控制 - 单击使用jQuery [英] ASP.net FileUploader Control - click using jQuery
问题描述
我用在ASP.net一个FileUpload控件。格式化输入按键是这样的，我想用一个简单的（格式化）按钮来激活一个jQuery函数，点击FileUpload控件来解决痛苦。这里是我的格式化按钮，叫btn_upload_FILE：
I'm using a FileUpload control in ASP.net. Formatting input buttons is such a pain that I'm trying to work around by using a simple (formatted) button to activate a jQuery function that clicks the FileUpload control. Here is my formatted button, called btn_upload_FILE:
<asp:Button ID="btn_upload_FILE" runat="server" class="c_button" Text="Import an EDD" OnClick="Main" />
下面是FileUpload控件：
Here's the FileUpload control:
<asp:FileUpload runat="server" ID="FILE_uploader"></asp:FileUpload>
和这里的jQuery的：
And here's the jQuery:
$('#<%= btn_upload_FILE.ClientID %>').click(function () {
$('#<%= FILE_uploader.ClientID %>').click();
});
超级简单，它的伟大工程，它会打开一个文件浏览器，让我选择一个文件。
Super-simple, and it works great, it opens a file browser and lets me select a file.
问题是，即使通过FileUpload控件似乎是工作，我选择文件实际上并未加载到FileUpload控件，所以我的code-背后还看不出来。它看起来的喜欢它的工作，但文件上传结束了空。该文件上传的.change事件不会开火，所以我知道什么也没有发生。如果我只是preSS FileUpload控件的按钮，它工作正常。
The problem is that, even through the FileUpload control appears to be working, the file I select isn't actually loaded into the FileUpload control, so my code-behind can't see it. It looks like it's working, but the FileUpload ends up empty. The FileUpload's .change event is not fired, so I know nothing is happening. If I just press the FileUpload control's button, it works fine.
谁能告诉我为什么的FileUpload没有收到文件，即使我可以用它浏览？任何帮助是一如既往，AP preciated。
Can anyone tell me why the FileUpload isn't receiving a file, even though I can browse with it? Any help is, as always, appreciated.
推荐答案
要使用的FileUpload上传文件，你需要做一个完整的回发，所以你必须使用同一个按钮：
To upload file using FileUpload, you need to do a full postback, so you have to use a button with it:
<asp:Button ID="btn_upload_FILE" runat="server" class="c_button" Text="Import an EDD" OnClick="Main" />
<asp:FileUpload runat="server" ID="FILE_uploader"></asp:FileUpload>
而在code后面，按钮的主要方式：
And in the code behind, the button's Main method:
protected void Main(object sender, EventArgs e)
{
// Specify the path on the server to
// save the uploaded file to.
String savePath = @"c:\temp\uploads\";
// Before attempting to perform operations
// on the file, verify that the FileUpload
// control contains a file.
if (FILE_uploader.HasFile)
{
// Get the name of the file to upload.
String fileName = FILE_uploader.FileName;
// Append the name of the file to upload to the path.
savePath += fileName;
// Call the SaveAs method to save the
// uploaded file to the specified path.
// This example does not perform all
// the necessary error checking.
// If a file with the same name
// already exists in the specified path,
// the uploaded file overwrites it.
FileUpload1.SaveAs(savePath);
// Notify the user of the name of the file
// was saved under.
UploadStatusLabel.Text = "Your file was saved as " + fileName;
}
else
{
// Notify the user that a file was not uploaded.
UploadStatusLabel.Text = "You did not specify a file to upload.";
}
}
You will find more here in MSDN.
希望它帮助！
编辑：
您还可以使用jQuery。首先，隐藏的asp：通过设置它的按钮的显示属性设置为NONE：
You can also use jquery. First, hide the asp:button by setting it's display Property to none:
<asp:Button ID="btn_upload_FILE" runat="server" class="c_button" Text="Import an EDD" OnClick="Main" Style="display:none" />
现在加入jQuery来触发这个按钮的Click事件时，有在文件上传一个文件：
Now add the jquery to trigger this button's click event when there is a file in FileUpload:
<script type="text/javascript">
$(document).ready(function () {
$(document).on('change', '#<%= FILE_uploader.ClientID %>', function () {
if (document.getElementById('<%= FILE_uploader.ClientID %>').files.length === 0) {
return;
}
$('#<%= btn_upload_FILE.ClientID %>').trigger('click');
});
});
</script>
和不要忘记参考在页面头部添加到jQuery的。
And don't forget to add a reference to jquery at the head of your page.
这篇关于ASP.net FileUploader控制 - 单击使用jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
