Want ajax to load multiple files on click event
Here is my .aspx code
<form id="form1" runat="server">
<asp:ToolkitScriptManager runat="server">
</asp:ToolkitScriptManager>
<asp:AjaxFileUpload ID="AjaxFileUpload1" runat="server"
Width="400px" OnUploadComplete="OnUploadComplete" Mode="Auto" />
<asp:Button ID="abc" runat="server" Text="Button" OnClientClick="$('.ajax__fileupload_uploadbutton').trigger('click');" OnClick="abc_Click" />
</form>
.aspx.cs code
protected void OnUploadComplete(object sender, AjaxControlToolkit.AjaxFileUploadEventArgs e)
{
string fileName = Path.GetFileName(e.FileName);
AjaxFileUpload1.SaveAs(Server.MapPath("~/uploads/" + fileName));
}
protected void abc_Click(object sender, EventArgs e)
{
// need file upload on this click and also need to store some outer data in this click event
}
How can I achieve ajax file upload in my own button click event as I need to upload multiple files and also other data on this button click
I have set up html and .cs control code that works well and loads multiple images with OnUploadComplete event, but I need to load images on abc_Click event so that on one click I can load images and also I can save data too
You should really consider porting your project to ASP.NET MVC . This will give you many advantages when sending different and multiple types of data to your code. Then you can create a ViewModel , which can contain a list of images as well as other required information, and send all the information to your server in one go.
Of course, I don't know if you are already familiar with MVC, but if not, refer to this link for more details: https://www.asp.net/mvc
Hope this helped a little, let me know.
source to share
There are many ways to upload multiple files in Asp.Net. You should use the following HTML method:
<asp:ScriptManager runat="server"></asp:ScriptManager>
<ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload1" runat="server" Width="500px" AllowedFileTypes="jpg,jpeg,png" MaximumNumberOfFiles="4" OnUploadComplete="AjaxFileUpload1_UploadComplete" />
C # event
using System;
using System.IO;
protected void AjaxFileUpload1_UploadComplete(object sender, AjaxControlToolkit.AjaxFileUploadEventArgs e)
{
string fileName = Path.GetFileName(e.FileName);
AjaxFileUpload1.SaveAs(Server.MapPath("~/uploads/" + fileName));
}
Or you can use JQuery to upload multiple files as shown below. Download jQuery.js and jQuery.MultiFile.js from jQuery add multiple files plugin
Html:
<asp:FileUpload ID="FileUploadJquery" runat="server" class="multi"/>
<asp:Button ID="btnJqueryMultipleFiles" runat="server" Text="Upload Files Using Jquery" onclick="btnJqueryMultipleFiles_Click"/>
</div>
C # event
protected void btnUpload_Click(object sender, EventArgs e)
{
HttpFileCollection multipleFiles = Request.Files;
for (int fileCount = 0; fileCount < multipleFiles.Count; fileCount++)
{
HttpPostedFile uploadedFile = multipleFiles[fileCount];
string fileName = Path.GetFileName(uploadedFile.FileName);
if (uploadedFile.ContentLength > 0 )
{
uploadedFile.SaveAs(Server.MapPath("~/Files/") + fileName);
lblMessage.Text += fileName + "Saved <br>";
}
}
}
source to share
So my guess is that everything works well, except that you want to initiate the download when there is some other button (perhaps in another part of your HTML markup). You can simply add a button on the same page:
<input type="button" value="Custom Upload Button"
onClick="$('.ajax__fileupload_uploadbutton').trigger('click');
return false;" />
source to share