I want to show Components in a tabs , so first of all create few components. In this project we have three components, First View Component public class AllViewComponent : ViewComponent { private readonly UserManager<ApplicationUser> _userManager; public AllViewComponent(UserManager<ApplicationUser> userManager) { _userManager = userManager; } public async Task<IViewComponentResult> InvokeAsync() { List<StudentViewModel> allUsers = new List<StudentViewModel>(); var items = await _userManager.Users.ToListAsync(); foreach (var item in items) { allUsers.Add(new StudentViewModel {Id=item.Id, EnrollmentNo = item.EnrollmentNo, FatherName = item.FatherName, Name = item.Name, Age = item.Age, Birthdate = item.Birthdate, Address = item.Address, Gender = item.Gender, Email = item.Email }); }
Introduction
The FileUpload control displays a text box control and a browse button that enable users to browse a file from the local or remote machine to upload it on the Web server. You can upload a file on the Web Server by specifying the full path of the file to be uploaded (for example D:\Myfiles\Test.txt) in the textbox of this control . Alternatively , you can select the file by clicking the browse button , and then locating it in the Choose File dialog box.
Public Properties of the FileUpload Class
FileBytes : Obtains an array of the bytes in a file that is specified by using a FileUpload control
FileContent : Obtains a Stream object that points to a file to upload using the FileUpload control.
FileName : Obtains the name of a file on a client to upload using the FileUpload control.
HasFile : Obtains a value indicating whether the FileUpload control contains a file.
PostedFile : Obtains the underlying HttpPostedFile object for a file that is uploaded by using the FileUpload control.
Public Method of the FileUpload Class
SaveAs : Saves the data of an uploaded file to a specified path on the web server.
Example of FileUpload control in ASP.NET
Multiple File Upload control on Same Page
This is the new features comes into the DOTNET Framework 3.5. If you have three or more file upload control on same page then what to do for save files into project directory. If you use traditional code like
if(fileupload1.hasfile)
{
//code)}
if(fileupload2.hasfile)
{
//code
}
This is the wrong for developer perspective. You can use new features of DOTNET Framework 3.5 i.e HttpFileCollection class. By using Request.Files property you can get the files from the server.
Check the simple example of it.
Source Code:
<div>
<asp:FileUpload ID="FileUpload1" runat="server" />
<br />
<asp:FileUpload ID="FileUpload2" runat="server" />
<br />
<asp:FileUpload ID="FileUpload3" runat="server" />
<br />
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Submit" />
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
</div>
protected void Button1_Click(object sender, EventArgs e)
{
string filepath = "E:\\Upload";
HttpFileCollection hfc = Request.Files;
for (int i = 0; i < hfc.Count; i++)
{
HttpPostedFile hpf = hfc[i];
try
{
if (hpf.ContentLength>0)
{
Label1.Text += "File Content Type: " + hpf.ContentType+"<br/>";
Label1.Text += "File Size: " + hpf.ContentLength + "<br/>";
Label1.Text += "File Name: " + hpf.FileName + "<br/>";
hpf.SaveAs(filepath + "\\" + System.IO.Path.GetFileName(hpf.FileName));
Label1.Text += "Location of the file: " + filepath + "\\" + System.IO.Path.GetFileName(hpf.FileName);
}
}
catch (Exception ex)
{
Label1.Text += "Error: " + ex.Message;
}
}
}
Code Generate the following output:
The FileUpload control displays a text box control and a browse button that enable users to browse a file from the local or remote machine to upload it on the Web server. You can upload a file on the Web Server by specifying the full path of the file to be uploaded (for example D:\Myfiles\Test.txt) in the textbox of this control . Alternatively , you can select the file by clicking the browse button , and then locating it in the Choose File dialog box.
Top Related article
- Fileupload control enable disable programmatically in ASP.NET
- Programmatically change border color of fileupload control in ASP.NET
- Programmatically change background color of fileupload control in ASP.NET
- How to validate fileupload control in asp.net also choose selected format
- How to insert image into database using file upload control
Public Properties of the FileUpload Class
FileBytes : Obtains an array of the bytes in a file that is specified by using a FileUpload control
FileContent : Obtains a Stream object that points to a file to upload using the FileUpload control.
FileName : Obtains the name of a file on a client to upload using the FileUpload control.
HasFile : Obtains a value indicating whether the FileUpload control contains a file.
PostedFile : Obtains the underlying HttpPostedFile object for a file that is uploaded by using the FileUpload control.
Public Method of the FileUpload Class
SaveAs : Saves the data of an uploaded file to a specified path on the web server.
Example of FileUpload control in ASP.NET
<%@ Page Language="C#" %>
<!DOCTYPE html>
<script runat="server">
protected void Button1_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile)
{
FileUpload1.SaveAs(Server.MapPath("~/images/" + FileUpload1.FileName));
}
else
{
emptyupload.Text = "Choose your file";
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1 {
font-size: larger;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="auto-style1">
<strong>Pick Your file from file upload control<br />
</strong>
<asp:FileUpload ID="FileUpload1" runat="server" />
<br />
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Save" />
<br />
<asp:Label ID="emptyupload" runat="server"></asp:Label>
</div>
</form>
</body>
</html>
Output
<!DOCTYPE html>
<script runat="server">
protected void Button1_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile)
{
FileUpload1.SaveAs(Server.MapPath("~/images/" + FileUpload1.FileName));
}
else
{
emptyupload.Text = "Choose your file";
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1 {
font-size: larger;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="auto-style1">
<strong>Pick Your file from file upload control<br />
</strong>
<asp:FileUpload ID="FileUpload1" runat="server" />
<br />
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Save" />
<br />
<asp:Label ID="emptyupload" runat="server"></asp:Label>
</div>
</form>
</body>
</html>
Only GIF image support by FileUpload control
<script runat="server">
protected void Button1_Click(object sender, EventArgs e)
{ string extn=string.Empty ;
if (FileUpload1.HasFile)
{
extn = System.IO.Path.GetExtension(FileUpload1.FileName);
if ("gif" == extn)
{
FileUpload1.SaveAs(Server.MapPath("~/images/" + FileUpload1.FileName));
emptyupload.Text = "Save sucessfully";
}
else
{
emptyupload.Text = "only gif support";
}
}
else
{
emptyupload.Text = "Choose your file";
}
}
</script>
Note : GetExtension is the method of the path class which is detect extension of the filename. protected void Button1_Click(object sender, EventArgs e)
{ string extn=string.Empty ;
if (FileUpload1.HasFile)
{
extn = System.IO.Path.GetExtension(FileUpload1.FileName);
if ("gif" == extn)
{
FileUpload1.SaveAs(Server.MapPath("~/images/" + FileUpload1.FileName));
emptyupload.Text = "Save sucessfully";
}
else
{
emptyupload.Text = "only gif support";
}
}
else
{
emptyupload.Text = "Choose your file";
}
}
</script>
Multiple File Upload control on Same Page
This is the new features comes into the DOTNET Framework 3.5. If you have three or more file upload control on same page then what to do for save files into project directory. If you use traditional code like
if(fileupload1.hasfile)
{
//code)}
if(fileupload2.hasfile)
{
//code
}
This is the wrong for developer perspective. You can use new features of DOTNET Framework 3.5 i.e HttpFileCollection class. By using Request.Files property you can get the files from the server.
Check the simple example of it.
Source Code:
<div>
<asp:FileUpload ID="FileUpload1" runat="server" />
<br />
<asp:FileUpload ID="FileUpload2" runat="server" />
<br />
<asp:FileUpload ID="FileUpload3" runat="server" />
<br />
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Submit" />
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
</div>
protected void Button1_Click(object sender, EventArgs e)
{
string filepath = "E:\\Upload";
HttpFileCollection hfc = Request.Files;
for (int i = 0; i < hfc.Count; i++)
{
HttpPostedFile hpf = hfc[i];
try
{
if (hpf.ContentLength>0)
{
Label1.Text += "File Content Type: " + hpf.ContentType+"<br/>";
Label1.Text += "File Size: " + hpf.ContentLength + "<br/>";
Label1.Text += "File Name: " + hpf.FileName + "<br/>";
hpf.SaveAs(filepath + "\\" + System.IO.Path.GetFileName(hpf.FileName));
Label1.Text += "Location of the file: " + filepath + "\\" + System.IO.Path.GetFileName(hpf.FileName);
}
}
catch (Exception ex)
{
Label1.Text += "Error: " + ex.Message;
}
}
}
Code Generate the following output:
Comments
Post a Comment