How to upload Image to Web APP (Asp.net) and hold it for processing? - asp.net

Question

I am trying to create a web app using asp.net (trying to get some knowledge in order to work on more advanced stuff later on). The app I'm trying to make needs to have a picture uploaded to it and then do some processing to it. Now the question, Can I have the user upload this picture display it on the page and hold it somewhere temporarily for processing without making use of a database?
Tried looking through YouTube and web but couldn't find any specific documentation.

Answer 1

Gee, I don't see why a database would matter?
If you don't have a database, that should not effect that you can just drop in a file up loader, up-load files to say some folder, and then display the list of files that been up-loaded. And you are 100% free to THEN process those files later that been dropped into that folder, right?
So, lets drop in a file up-loader (you can choose/use one of a "gazillion" such up-loaders, or use a simple fileupload control.
Right below that control, then drop in say a grid view to display the files you up-loaded into that folder.
So, say this markup:
<asp:RadioButtonList ID="RadioButtonList1" runat="server" height="40px"
RepeatDirection="Horizontal" CssClass="rMyChoice" ClientIDMode="Static"
AutoPostBack="true" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged">
<asp:ListItem Selected="True">Upload Files</asp:ListItem>
<asp:ListItem>My Files</asp:ListItem>
</asp:RadioButtonList>
<br />
<div id="uploadfiles" runat="server" style="width:550px">
<ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload1" runat="server"
OnUploadComplete="AjaxFileUpload1_UploadComplete"
OnClientUploadCompleteAll="AllDone" />
</div>
<div id="myfiles" runat="server" style="width: 700px">
<asp:GridView ID="GridFiles" runat="server"
AutoGenerateColumns="False" ShowHeaderWhenEmpty="true" CssClass="table table-hover" >
<Columns>
<asp:BoundField DataField="FileName" HeaderText="FileName" />
<asp:BoundField DataField="Created" HeaderText="UpLoaded" />
<asp:BoundField DataField="Size" HeaderText="Size" />
<asp:TemplateField HeaderText="Preview">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" Width="120px"
ImageUrl='<%# "UpLoadFiles/" + Eval("FileName") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Download" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Button ID="cmdDownLoad"
runat="server" Text="Download" CssClass="btn"
OnClick="cmdDownLoad_Click"
CommandArgument='<%# Eval("FileName") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<br />
</div>
I am using the ajaxtoolkit up-loader, but it kind of don't really matter here at all.
Then below the up-loader, I just dropped in a grid view to display the files after up-loading.
Heck, might as well use a tab control, or a simple radio button list, so the user can view files, or up-load some more.
So, with above, I have this code behind:
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
RBShow()
End Sub
Sub LoadGrid()
Dim rstFiles As New DataTable
rstFiles.Columns.Add("FileName")
rstFiles.Columns.Add("Created", GetType(DateTime))
rstFiles.Columns.Add("Size")
Dim sFolder As String = "~/UpLoadFiles"
Dim MyFolder As New DirectoryInfo(Server.MapPath(sFolder))
Dim MyFileList() As FileInfo = MyFolder.GetFiles("*.*")
For Each OneFile As FileInfo In MyFileList
Dim OneRow As DataRow = rstFiles.NewRow
OneRow("FileName") = OneFile.Name
OneRow("Created") = OneFile.CreationTime.ToString("G")
OneRow("Size") = OneFile.Length
rstFiles.Rows.Add(OneRow)
Next
GridFiles.DataSource = rstFiles
GridFiles.DataBind()
End Sub
Protected Sub RadioButtonList1_SelectedIndexChanged(sender As Object, e As EventArgs)
RBShow()
End Sub
Sub RBShow()
' routine to hide and show a div based on radio button (this is our fake tab control)
If RadioButtonList1.SelectedIndex = 0 Then
uploadfiles.Style.Add("Display", "normal")
myfiles.Style.Add("Display", "none")
Else
LoadGrid()
uploadfiles.Style.Add("Display", "none")
myfiles.Style.Add("Display", "normal")
End If
End Sub
The file uploader has a up-load file complete event. That code is simple this:
Protected Sub AjaxFileUpload1_UploadComplete(sender As Object, e As AjaxControlToolkit.AjaxFileUploadEventArgs)
Dim sFile As String = Server.MapPath("~/UpLoadFiles/") & e.FileName
AjaxFileUpload1.SaveAs(sFile)
End Sub
So, when we run the page, we get this:
So, since you don't have a database - don't need one!
Then just load up a grid view, or listbox or whatever with a list of files from the folder you save all the files being up-loaded.
of course in above, I do have a download button.
that code looks like this:
Protected Sub cmdDownLoad_Click(sender As Object, e As EventArgs)
Dim myBut As Button = sender
Dim strFileOnly As String = myBut.CommandArgument
Dim strFile As String = ""
strFile = Server.MapPath("~/UpLoadFiles/" + strFileOnly)
Dim sMineType As String = MimeMapping.GetMimeMapping(strFileOnly)
Response.ContentType = sMineType
Response.AppendHeader("Content-Disposition", "attachment; filename=" + strFileOnly)
Response.TransmitFile(strFile)
Response.End()
End Sub
So, the files are still in that folder for "later" processing.
And even better, if you go back to the page, you can "view" the list of files already up-loaded, or up-load a few more.
So, it not at all clear why a database is required. Those files are just sitting in a folder.
You can then process those files, say when done move to another folder called MyProcessed.
And then you are free to up-load more files for processing that will reside in that MyUpLoads folder.