File Upload Synchronously

[Andrew]

I need a file upload that is able to select multple files synchronously in an html form. Is there a way to do this? It looks like your demo for the javascript controls shows it working async? I can't post to the server until the submit button of the form is selected. I'm hoping to get an example if this is possible. Thanks.

[John Arokyaraj V]

Hi Andrew,

Thanks for using Syncfusion Products.

We have provided the sample code for achieving the synchronous upload option of Uploadbox using ASP.NET MVC application.

For Synchronous Upload,

1.      We have created the submit button, reset button and the target <div> element for Uploadbox inside the Html.BeginForm.

[View Page cshtml]

 

@using (Html.BeginForm("Index", "upload", FormMethod.Post, new { id = "uploadForm", enctype = "multipart/form-data" }))

{

    <div id="syncupload"></div>

    <input type="submit" class="inputbutton" value="Upload" />

    <input type="reset" class="inputbutton" value="Reset" />

}

2.      We have initialized the ejUploadbox with asyncUpload api set to false.

 

[Script]

 

<script type="text/javascript">

    $(function () {

        $('#syncupload').ejUploadbox({ asyncUpload: false });

    });

 

</script>

 

We have provided the sample server side code for processing the form submit action.

 

[Controller c#]

 

        public ActionResult Index()

        {

            return View();

        }

        [AcceptVerbs(HttpVerbs.Post)]

        public ActionResult Index(IEnumerable<HttpPostedFileBase> syncupload)

        {

            if (syncupload != null)

                foreach (var file in syncupload)

                {

                    if (file != null)

                    {

                        var fileName = Path.GetFileName(file.FileName);

                        var destinationPath = Path.Combine(Server.MapPath("~/App_Data"), fileName);

                        file.SaveAs(destinationPath);

                        return View("UploadSuccess");

                    }

                }

            return View();

        }

 

        public ActionResult UploadSuccess()

        {

            return View();

        }

 

 

Please let us know if this helps.

 

Thanks/Regards,

John Arokyaraj.V

 

[Andrew]

Wow....perfect. Exactly what I was looking for! Thank you!

[John Arokyaraj V]

Hi Andrew,

 Thanks for your update. We appreciate the opportunity to assist you.

 Thanks/Regards,

John Arokyaraj.V

[Jenson Chew]

May I know how can I pass the file name and path value back to the .aspx.cs code behind file of the page that's implementing this client-side uploadbox control?

[Arun Palaniyandi]

Hi Jenson,

Thanks for the update.

Query:” May I know how can I pass the file name and path value back to the .aspx.cs code behind file of the page that's implementing this client-side uploadbox control?”

You can get the file details in code behind by getting the files from Request.Files and then pass into database. Please refer the below code snippet.

<code>

protected void btnUploadClick(object sender, EventArgs e)

        {

            string fname;

            HttpFileCollection hfc = Request.Files;         

                for (int i = 0; i <= hfc.Count - 1; i++)

                {

                    HttpPostedFile hpf = hfc[i];

                    if (hpf != null && hpf.ContentLength > 0)

                    {

                        fname = Path.GetFileName(hpf.FileName);

                        hpf.SaveAs(Server.MapPath(Path.Combine("~/upload/", fname)));                  

                        status.Text  += "FileName :" + fname;

                        status1.Text += "FilePath : " + Server.MapPath(Path.Combine("~/upload/"));

                        }                                                                

                }            
            }
</code>

For this scenario we have also attached a sample. Please find the sample below.
http://www.syncfusion.com/downloads/support/forum/121578/ze/upload-249855840

Please contact us in future if you have any queries.

Regards,
Arun P