File upload using HTML file type - asp.net

I want to upload a file on my aspx page.
I am using
<form id="frmId" method="post" enctype="Multipart/form-data">
<input type="file" id="file1"/>
<input type="submit" id="btnsubmit"/>
</form>
and in code behind I am trying to get this file. Its not letting me to get the file until I use server side input file control. I don't want to use runat="server" attribute with my file control.
Do anyone know how to do this.

Have you tried the Request.Files collection?

You can not access control on server side code with out runat="server" attribute.

Related

Bootstrap file upload not working with ASP Ajax AsyncFileUpload

So I am having an issue on my ASP web form, where I am using Bootstrap and trying to make use of the Ajax AsyncFileUpload control. The file upload control looks like this:
<div id="LoafFileUploadTemplate" class="custom-file">
<asp:AsyncFileUpload ID="LoafFileUpload" runat="server" ClientIDMode="Static" CssClass="custom-file-input file-upload" enctype="multipart/form-data" method="post" OnClientUploadStarted="Loaf_UploadStarted" OnClientUploadComplete="Loaf_UploadComplete" OnUploadedComplete="LoafFileUpload_UploadedComplete" />
<label class="custom-file-label">Choose File</label>
</div>
<asp:Button ID="LoafFileUploadComplete" runat="server" ClientIDMode="Static" CssClass="d-none" OnClick="LoafFileUploadComplete_Click" />
For some reason the LoafFileUpload_UploadedComplete method didn't fire when the uploader was finished. I've read that I need to add enctype="multipart/form-data" method="post" to the file input. I have done that, but still doesn't work. Turns out the way bootstrap renders the AsyncFileUpload control, these two attributes get applied to a div instead of the file upload control, as seen below:
<div id="LoafFileUploadTemplate" class="custom-file">
<div id="LoafFileUpload" class="custom-file-input file-upload" enctype="multipart/form-data" method="post">
<input type="hidden" name="ctl00$CPH_main$CsatoltFajlok$LoafFileUpload$ctl00"><div><input name="ctl00$CPH_main$CsatoltFajlok$LoafFileUpload$ctl02" type="file" id="ctl00_CPH_main_CsatoltFajlok_LoafFileUpload_ctl02" style="" size="20"></div>
</div>
<label class="custom-file-label">Fájl feltöltése</label>
</div>
</div>
<input type="submit" name="ctl00$CPH_main$CsatoltFajlok$LoafFileUploadComplete" value="" id="LoafFileUploadComplete" class="d-none">
So as seen here, the enctype="multipart/form-data" method="post" attributes are applied onto the div containing the file input, not the input itself. Because of this, the file doesn't get posted to the server. Anyones know a fix for this?
Turns out I didn't need to add enctype="multipart/form-data" method="post" to the file input, but to the form itself (in my case, in the master page). It works now.

Change DNN Form into normal GET form

I'm working on making some changes to a Dot Net Nuke website with a customized skin. I found out that the header to the skins file was located in 'Default.aspx' here.
The form has some very strange behavior. I have had to disable the enter button because pressing within the form causes the webpage to go to "/HOME.aspx" however that action is never specified within the Default.aspx.
The code is as follows.
<dnn:Form id="Form" runat="server" ENCTYPE="multipart/form-data" >
<asp:Label ID="SkinError" runat="server" CssClass="NormalRed" Visible="False"></asp:Label>
<asp:PlaceHolder ID="SkinPlaceHolder" runat="server" />
<input id="ScrollTop" runat="server" name="ScrollTop" type="hidden" />
<input id="__dnnVariable" runat="server" name="__dnnVariable" type="hidden" />
</dnn:Form>
The form after being processed displays in the browser as.
<form name="Form" method="post" action="/HOME.aspx" onsubmit="javascript:return WebForm_OnSubmit();" id="Form" enctype="multipart/form-data">
What I want the code to display as is simply.
<form name="Form" method="get" action="/SearchResults.aspx" id="Form">
I tried removing the dnn code with the html directly but removing the dnn form causes the website to crash.
EDIT
What I'm trying to do can be seen at http://www.ontariosheep.org
Notice if you press the button the search works but pressing enter causes the page to refresh.
You can use some Javascript to do this:
jQuery('#SearchBox').keypress(function(e){
if(e.which == 13){
e.preventDefault();CallSearchPage('http://www.ontariosheep.org/SearchResults.aspx');
}
});
You would need to put that in script tags and also in a jQuery document ready area... like
<script>
jQuery(document).ready(function(){
//code above here
});
</script>
Changing the behavior of the form in DNN is not something you are going to do easily. DNN uses the ASP.NET Web Forms model, so the action for the page is always the current page.
If you want to customize this the only real way is to modify the form action via JavaScript on a specific page, but note that doing that prior to a button click or similar trigger WILL break all administration functions on the page that require a postback to the server.
What are you trying to accomplish?

How to get FilePath of file being uploaded by FileUpload control

i want to retrieve the path of file being uploaded by FileUpload control. i have tried FileIpload1.FileName and FileUpload1.PostedFile.FileName but both of these statements return only file name and not the path (in mozilla firefox).
Thanx
Since the FileUpload is a server-side control, it does not have any property that returns complete file name and file path. To get the file path from the browser, you'll have to use javascript. Here's an example:
<form id="Form1" action="" method="post">
<input type="file" />
<input type="button" onclick="alert(this.previousSibling.value);"
value="select file and press the button" />
However, browsers never reveal the original path of the file from the client side - not even to JavaScript. So all you might get is: C:\fakepath\ + your file name

How to upload files without using FileUpload control

I want to open file dialog on click of a button in asp.net without using file upload control. Is there a way to do this?
You could use HTML directly if you don't like server controls: <input type="file" name="foo" />
The only way to open a browse dialog (short of using from client side plugin, such as a Java Applet) is to use the file type input:
<input type="file" name="somename" />
This is what the FileUpload control renders.
If you don't want to use that control, you can just use the direct HTML element.
Each browser will render this slightly differently though.

How to upload a file using asp.net without posting the whole page back?

I want to upload a file using asp.net so I do not want to post back the page while uploading . How can I do that and is there any way to do it using Ajax .
Make the file upload form target a hidden iframe.
<iframe name="UploadTarget" style="display:none"></iframe>
<form target="UploadTarget" action="postfile" method="post" enctype="multipart/form-data">
<input type="file" name="MyFile">
<input type="submit" name="submit" value="Send me a file">
</form>
The final trick is to add to your response page:
<script type="text/javascript">parent.somecallbackfunction("Here is some data")</script>
To let your parent page ( the one containing the hidden iframe) know that the the file upload has completed.
An iframe can be placed on your page and can contain an input element, type=file. You can manipulate and submit the iframe form via javascript. You can hide the iframe by setting its CSS style to display:none. This is generally known as the hidden iframe method.
Use something proven like SWFUpload and save yourself the time of writing your own client code.

Resources