Using "<input type="file" .... />" instead of asp:FileUpload

Question

I'm modifying an existing ASP.NET project. The original author erroneously tried to create a styled asp:FileUpload by setting its visibility to hidden and just creating two custom styled browse and save buttons.

For security reason, IE does not permit this. My strategy is to instead try to use input tags with type="file", like this example. So if I set up the input like <input type="file" ID="inputFile" /> how do I access/save the file in my code behind, inputFile.SaveAs("someFile.txt");? Also (in code behind) can I do something like inputFile.HasFile or is there some other analog of this?

As per recommendations I'm trying something like the following:

             <td>
                Enabled: <asp:CheckBox ID="CheckBox2" runat="server" />    &nbsp;&nbsp;
                <div id="testFileUploader">>
                   <input type="file" id="browserHidden" runat="server" />
                   <div id="browserVisible"><input type="text" id="fileField" /></div>
                </div>
             </td>

Ah yes, I forgot to include this. Thanks. What about accessing it in the code behind, do .SaveAs() and .HasFile work on the inputFile object? — kmarks2
– kmarks2, Commented Apr 25, 2013 at 14:43
@kmarks2 you don't need to set runat="server" for a plain HTML form elements everywhere, setting always runat is required for asp: elements, for the plain HTML, just set once runat at the main form, and then you will be able to get html resource of any plain html object from a Request, loot at my answer. — Secret
– Secret, Commented Apr 25, 2013 at 15:30
@kmarks2 please, don't forget to mark a helpful answer by clicking on accept icon — Secret
– Secret, Commented Apr 25, 2013 at 18:19

Secret · Accepted Answer · 2013-04-25 15:26:35Z

So, you can generate a random file name for the a future upload, based on the GUID at the CodeBehind of ASPX page:

HttpPostedFile filePosted = Request.Files["uploadFieldNameFromHTML"];

if (filePosted != null && filePosted.ContentLength > 0)
{
    string fileNameApplication = System.IO.Path.GetFileName(filePosted.FileName);
    string fileExtensionApplication = System.IO.Path.GetExtension(fileNameApplication);

    // generating a random guid for a new file at server for the uploaded file
    string newFile = Guid.NewGuid().ToString() + fileExtensionApplication;
    // getting a valid server path to save
    string filePath = System.IO.Path.Combine(Server.MapPath("uploads"), newFile);

    if (fileNameApplication != String.Empty)
    {
        filePosted.SaveAs(filePath);
    }
}

For Request.Files["uploadFieldNameFromHTML"] set the ID in HTML code here:

<input type='file' id='...' />

Also, don't forget to define runat="server" at the main form in ASPX page, it's better to set it at the main form and don't forget about enctype="multipart/form-data" parameter of the <form>:

<body>
    <form enctype="multipart/form-data" id="form1" runat="server">
        <input type='file' id='uploadFieldNameFromHTML' />
...

emerson.marini · Accepted Answer · 2013-04-25 14:43:40Z

3

Add a runat="server" to the object. This way it will work on the CodeBehid just like any asp:FileUpload control.

answered Apr 25, 2013 at 14:43

emerson.marini

9,3462 gold badges35 silver badges50 bronze badges

1 Comment

kmarks2 Over a year ago

I've edited my original post to reflect doing it this way. But now I cannot build because I get errors everything I try to do browserHidden.HasFile or browserHidden.SaveAs("someFile.txt"), etc . Indeed it seems that nothing that pops in in Intellisence on when I type browser. seems to let me save the file. How can I do this on an input object?

Community · Accepted Answer · 2017-05-23 12:34:27Z

1

As commented you can add the runat="server" to you input file tag.

By another hand, there is already a similar post about what you're asking for. Check this out:

Uploading Files in ASP.net without using the FileUpload server control

Hope this help

Cheers!

edited May 23, 2017 at 12:34

CommunityBot

11 silver badge

answered Apr 25, 2013 at 15:11

MikePR

3,0166 gold badges40 silver badges70 bronze badges

Comments

Dave Newman · Accepted Answer · 2013-04-25 15:11:34Z

0

if(fileUrunResim.HasFile)
    fileUrunResim.SaveAs(MapPath("~/Images/" + fileUrunResim.FileName));


**if you unique filename,**

string extension = Path.GetExtension(fileUrunResim.FileName);

string fileName = Guid.NewGuid().ToString().Substring(0, 25) + extension ;


if(fileUrunResim.HasFile)
    fileUrunResim.SaveAs(MapPath("~/Images/" + filename ));

edited Apr 25, 2013 at 15:11

Dave Newman

1,01610 silver badges15 bronze badges

answered Apr 25, 2013 at 14:48

Abdullah SARGIN

1,6461 gold badge13 silver badges19 bronze badges

Collectives™ on Stack Overflow

Using "<input type="file" .... />" instead of asp:FileUpload

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related