With HTML5 and ASP.NET 4.5, I created a page that will allow the user to upload multiple files. The ASPX code looks like:
<asp:FileUpload runat="server" ID="UploadImages" AllowMultiple="true" />
<asp:Button runat="server" ID="uploadedFile" Text="Upload" OnClick="uploadFile_Click" />
<asp:Label ID="listofuploadedfiles" runat="server" />`
c# code:
protected void uploadFile_Click(object sender, EventArgs e)
{
if (UploadImages.HasFiles)
{
foreach (HttpPostedFile uploadedFile in UploadImages.PostedFiles)
{
string fileName = Path.GetFileName(uploadedFile.FileName);
uploadedFile.SaveAs("C:\\Users\\username\\Desktop\\Uploaded\\" + fileName);
listofuploadedfiles.Text += String.Format("{0}<br />", uploadedFile.FileName);
}
}
}
The user selects the files using the FileUpload control and clicks the Upload button and it works great.
My question is: Is is possible to upload files using this method without the user selecting the files? I'd like to have the app always point to a directory on the users hard drive and default to uploading the files in that directory.
The user would see the contents of that directory in a list box and click the upload button or some variation to that.
I don't see any way to add files to the FileUpload control in code.
Related
I want to create a drop down that displays all the available we pages with in a specific folder in my web app. So basically I have an Admin page and there I want to have a drop down that displays the web pages in a folder named "Clients". This drop down needs to be updated automatically when a new web page is created within that folder.
This is all I have so far in my code:
<br />
<b>Select Web Page:</b>
<asp:DropDownList ID="Web_Pages" runat="server" AutoPostBack="true"
OnSelectedIndexChanged="WebPage_SelectedIndexChanged">
</asp:DropDownList><br />
<br />
And Code Behind:
protected void WebPage_SelectedIndexChanged(object sender, EventArgs e)
{
// Not sure what to do here to display the pages??
}
Thanks!
You can get the file listing and add them to your dropdown:
string path = Server.MapPath("/");
string[] files = Directory.GetFiles(path, "*.aspx")
.Select(x => Path.GetFileNameWithoutExtension(x));
Web_Pages.Items.AddRange(files);
And this code is actually should go to Page_Load not SelectedIndexChanged.
I'm working on a project in which I have to upload .txt files. I'm using asp.net FileUpload. Here is a piece of code:
<div class="custom-file">
<asp:FileUpload ID="inputFileTXT" CssClass="custom-file-input" runat="server" />
<label id="lblFileName" runat="server" class="custom-file-label" for="inputFileTXT">Elegir archivo</label>
</div>``
I'm using styles from MDBootstrap.
The thing is that I want to do stuff when a user clicks on the asp:fileUpload element and selects a file WITHOUT CLICKING ON A BUTTON. I've been searching but I didn't find how to detect dynamically this action. The asp:fileUpload has no event such as OnUploading.
PD: I tried using an UpdatePanel but when it makes the postback it seems like the uploaded file disapears. Maybe this is the way but I couldn't make it work.
You can add a dummy LinkButton to the page and leave it empty, but give it an OnClick, in which you would process the file.
<asp:FileUpload ID="FileUpload1" runat="server" accept="image/*" />
<asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click"></asp:LinkButton>
Then in code behind add the onchange trigger to the FileUpload control that will do a PostBack of LinkButton1.
protected void Page_Load(object sender, EventArgs e)
{
FileUpload1.Attributes.Add("onchange", "__doPostBack('" + LinkButton1.UniqueID + "','')");
}
PS do not put a FileUpload Control in an UpdatePanel.
You want to detect when a file is assigned to the upload just use change event.
Jquery solution:
$('#inputFileTXT').on('change', function(){
//do stuff
});
javascript solution:
<asp:FileUpload ID="inputFileTXT" CssClass="custom-file-input" runat="server" onchange="doStuff(this);" />
function doStuff(control){
//do stuff
}
You can then read files by using FileReader api (https://developer.mozilla.org/en-US/docs/Web/API/FileReader).
and access files using .files:
var files = $('#inputFileTxt').files;
Please have a look at this link
You should get the file details in FileUpload1 (fileUpload control Id: inputFileTXT in your case).
I am having difficulty understanding on how to go about displaying images inside sub directories.
Currently I have the following code which goes about displaying the image files within these subdirectories
Code Behind
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
List<string> files = new List<string> (Directory.GetFiles(Server.MapPath("/Screenshots/"), "*.png", SearchOption.AllDirectories));
files = files.Select(s => s.Replace(#"D:\wwwroot\blah\blah", "")).ToList();
rptDirectory.DataSource = files;
rptDirectory.DataBind();
}
}
Front end
<asp:Repeater ID="rptDirectory" runat="server">
<HeaderTemplate>
<h2>Results</h2>
<br />
<div style="display: inline;">
</HeaderTemplate>
<ItemTemplate>
<ul>
<li> <asp:HyperLink ID="hplFolder" runat="server" NavigateUrl="<%# Container.DataItem%>" Text="<%# Container.DataItem %>" /></li>
</ul>
</ItemTemplate>
</asp:Repeater>
The above works fine and I am able to display all the images on one page.
However, I want to first display their parent folders first as a hyperlink/link where user then clicks on the link and it take them to another page where all the images for that parent folder will be displayed
Currently the folder structure is as follows
Screenshot (Parent)
Folder1 (Child)
Another Folder (Siblings)
Images
So basically want to Display the Folder 1 name as the hyperlink and then when I click on the folder it takes me to another page where the images are displayed.
Should I use another asp panel to display the images?
Hope I haven't confused what I have said above?
Thanks
You need to use a tree view
Try this http://www.aspsnippets.com/Articles/Display-Directory-Folder-structure-using-ASPNet-TreeView-control-in-C-and-VBNet.aspx
here is my code :
<label for="image" >Image input</label>
<input id="image" type="file" name="pic" accept="image/*">
i don’t know the code behind to get value from the inserted image and save it in my project folder. please help me. thanks in Advance.
If you want to access what is put into the files collection using jScript:
function SaveImage()
{
var uploadFileElement = document.getElementById("image");
var theFile = uploadFileElement.files[0];
// Use AJAX or call a PageMethod to initiate Server Side Processing
// to Save the file
}
Just add a standard html button on your form that calls this function to initiate the saving of your file.
If you want to use standard Server Side (ASP.NET Controls), I would suggest using the FileUpload control.
Put this in your aspx page:
<asp:FileUpload ID="FileUpload_UploadFile" runat="server" />
<asp:Button ID="Button_UploadFile" runat="server" Text="Upload File" onclick="Button_UploadFile_Click" />
Put this in your code behind (.cs):
private void Button_UploadFile_Click(object sender, EventArgs e)
{
if (FileUpload_UploadFile.HasFile)
{
// IMPLEMENT YOUR CODE FOR SAVING THE FILE
}
}
I'm trying to use the FileUpload control in ASP.NET
Here's my current namespace setup:
using System;
using System.IO;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
And within my class, I'm just using:
FileUpload fileUpload = new FileUpload();
However, none of the attributes that are normally part of FileUpload seem to be available... such as .HasFile. I'm attempting to make the Button click method in the code behind, I have noticed that most of the usage of .HasFile is in the code in front, however it was my understanding that this shouldn't matter.
Does anyone know why?
ASP.NET controls should rather be placed in aspx markup file. That is the preferred way of working with them. So add FileUpload control to your page. Make sure it has all required attributes including ID and runat:
<asp:FileUpload ID="FileUpload1" runat="server" />
Instance of FileUpload1 will be automatically created in auto-generated/updated *.designer.cs file which is a partial class for your page. You usually do not have to care about what's in it, just assume that any control on an aspx page is automatically instantiated.
Add a button that will do the post back:
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
Then go to your *.aspx.cs file where you have your code and add button click handler. In C# it looks like this:
protected void Button1_Click(object sender, EventArgs e)
{
if (this.FileUpload1.HasFile)
{
this.FileUpload1.SaveAs("c:\\" + this.FileUpload1.FileName);
}
}
And that's it. All should work as expected.
Instead of instantiating the FileUpload in your code behind file, just declare it in your markup file (.aspx file):
<asp:FileUpload ID="fileUpload" runat="server" />
Then you will be able to access all of the properties of the control, such as HasFile.
Adding a FileUpload control from the code behind should work just fine, where the HasFile property should be available (for instance in your Click event).
If the properties don't appear to be available (either as a compiler error or via intellisense), you probably are referencing a different variable than you think you are.
My solution in code behind was:
System.Web.UI.WebControls.FileUpload fileUpload;
I don't know why, but when you are using FileUpload without System.Web.UI.WebControls it is referencing to YourProject.FileUpload not System.Web.UI.WebControls.FileUpload.
I have noticed that when intellisence doesn't work for an object there is usually an error somewhere in the class above line you are working on.
The other option is that you didn't instantiated the FileUpload object as an instance variable. make sure the code:
FileUpload fileUpload = new FileUpload();
is not inside a function in your code behind.
Old Question, but still, if it might help someone, here is complete sample
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="FileUpload1" runat="server" /><br/>
<asp:Button ID="Button1" runat="server" Text="Upload File" OnClick="UploadFile" /><br/>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</div>
</form>
In your Code-behind, C# code to grab file and save it in Directory
protected void UploadFile(object sender, EventArgs e)
{
//folder path to save uploaded file
string folderPath = Server.MapPath("~/Upload/");
//Check whether Directory (Folder) exists, although we have created, if it si not created this code will check
if (!Directory.Exists(folderPath))
{
//If folder does not exists. Create it.
Directory.CreateDirectory(folderPath);
}
//save file in the specified folder and path
FileUpload1.SaveAs(folderPath + Path.GetFileName(FileUpload1.FileName));
//once file is uploaded show message to user in label control
Label1.Text = Path.GetFileName(FileUpload1.FileName) + " has been uploaded.";
}
Source: File Upload in ASP.NET (Web-Forms Upload control example)