Thursday, June 21, 2007

Asp.net File Upload Control Using with just one step

In our projects sometimes we need to use the file upload control. Asp.net 2.0 have
a build-in File-upload. In asp.net 1.x web controls didn’t had any builtin file-upload
control. Then we had to use a html input tag with type attribute set to “file” and
to use in server side add runat=”server” attribute.

<input id="myfileuploader" type="file" runat="server"/>

We all know how to work with a file upload control, today we will be discussion
about a new approach of file-upload. file-upload consists of two step . first we
have to select the file and then submit the page with a button or some kind of other
mechanism. To day we will try to minimize one step. If we want to upload the file
with just one step that is selecting the file here is the Technique

A file upload control which is eventually truned into a input html element have
three client side events

    * onBlur      
    * onChange
    * onFocus

we will utilize the onChange event… here is what we will do. frist add a asp.net
2.0 fileupload control in our page. then in pageload event add a attribute in attribute
collection. then write a javascript funtion to submit the form and in code do what
ever we whan….

 
task 1 : add a fileupload control

task 2: add the onchange attribute as FileUpload1.Attributes.Add("onchange", "doSomeStuff()");

task 3: add the javascript to submit the page

<script language="javascript"
type="text/javascript">

function doSomeStuff()
{

         document.forms[0].submit();

}

</script>

Thats it you are good to go.. in page load event check wheither the filename is
empty or not and then do the file upload.