Support forums - Ajax-based-File-storage demo

Support forums » Products » Ajax Uploader » Re: Ajax-based-File-storage demo

Ajax-based-File-storage demo

Last post 03-03-2010, 10:32 AM by senthilkumart. 2 replies.


	Sort Posts: Previous Next

12-20-2009, 6:09 PM 57849

mani06ah
Joined on 12-19-2009
Posts 4

Ajax-based-File-storage demo

Reply Quote

Hi all,

in the demo http://ajaxuploader.com/Demo/Ajax-based-File-storage.aspx there is two optional textfields "file name" and "description".

They are missing in the product pack of ajax uploader, can anyone tell me how to add them manual?

Second,

when you upload a file using the demo there "pops" the processbar down and afterwards you get the attachment box with the green checkmarks - this quick disapears though, can i get this to stay active and not disapear after a few seconds?

Best Regards / Marry Christmas to you all

12-20-2009, 9:45 PM 57852 in reply to 57849

cutechat
Joined on 07-22-2004
Posts 2,332

Re: Ajax-based-File-storage demo

Reply Quote

Hi,

The filename/description is design for ajax uploader v1 , for that version uploader do not support multiple files uploading.

It just use the specified filename when rename the file at the event handler.

the event handler code is this :

protected void Uploader1_FileUploaded(object sender, UploaderEventArgs args)
    {
        string filename = TextBoxFileName.Text;
        if (string.IsNullOrEmpty(filename))
        {
            filename = args.FileName;
        }
        else
        {
            if (!string.Equals(Path.GetExtension(filename), Path.GetExtension(args.FileName), StringComparison.InvariantCultureIgnoreCase))
            {
                filename += Path.GetExtension(args.FileName);
            }
        }
        string description = TextBoxDescription.Text;

string newname = "myfile." + args.FileGuid + "." + args.FileName + ".resx";
        SampleDB.ExecuteNonQuery("INSERT UploaderFiles (UserId,UploadTime,Description,FileGuid,FileSize,FileName,TempFileName,IPAddress) VALUES ({0},{1},{2},{3},{4},{5},{6},{7})"
                            , SampleDB.GetCurrentUserId(), DateTime.Now, description, args.FileGuid, args.FileSize, filename, newname, Context.Request.UserHostAddress);

args.CopyTo(Path.Combine(SampleUtil.GetFileDirectory(), newname));

TextBoxFileName.Text = "";
        TextBoxDescription.Text = "";
        GridView1.DataBind();
    }

FileName:<asp:TextBox ID="TextBoxFileName" Width="200px" runat="server"></asp:TextBox>

Description:<asp:TextBox ID="TextBoxDescription" Width="200px" runat="server"></asp:TextBox>

Here is another advanced example to let users type information for each file:

<%@ Page Language="C#" %>

<%@ Import Namespace="CuteWebUI" %>
<%@ Register TagPrefix="CuteWebUI" Namespace="CuteWebUI" Assembly="CuteWebUI.AjaxUploader" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

protected void UploadAttachments1_AttachmentAdded(object sender, AttachmentItemEventArgs args)
	{
		TextBox tb = (TextBox)args.Item.FindControl("textboxDesc");
		tb.Text = args.Item.ClientData;
	}

protected void UploadAttachments1_AttachmentCreated(object sender, AttachmentItemEventArgs args)
	{
		TextBox tb = (TextBox)args.Item.FindControl("textboxDesc");
		tb.TextChanged += new EventHandler(tb_TextChanged);
	}

void tb_TextChanged(object sender, EventArgs e)
	{
		TextBox tb=(TextBox)sender;
		for (Control c = tb; c != null; c = c.Parent)
		{
			if (c is AttachmentItem)
			{
				((AttachmentItem)c).ClientData = tb.Text;
				return;
			}
		}
	}

protected void buttonTell_Click(object sender, EventArgs e)
	{
		StringBuilder sb = new StringBuilder();
		sb.Append("There's " + UploadAttachments1.Items + " items:");
		foreach (AttachmentItem item in UploadAttachments1.Items)
		{
			sb.Append("<br/>");
			sb.Append(item.FileName);
			sb.Append("&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;&nbsp;&nbsp;");
			sb.Append(item.ClientData);
		}
		labelMsg.Text = sb.ToString();
	}
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title>Untitled Page</title>
</head>
<body>
	<form id="form1" runat="server">
		<div>
			<button id='btnUpload' style="display: none;" onclick="Upload_Click();return false;">
				Start Upload</button>
			<CuteWebUI:UploadAttachments runat="server" ID="UploadAttachments1" ManualStartUpload="True"
				OnAttachmentAdded="UploadAttachments1_AttachmentAdded" OnAttachmentCreated="UploadAttachments1_AttachmentCreated"
				NumFilesShowCancelAll="1000" InsertText="Add files">
				<ItemTemplate>
					<asp:TextBox runat="server" ID="textboxDesc" />
				</ItemTemplate>
			</CuteWebUI:UploadAttachments>
			<br />
			<table id='clientTable' style="display: none; font-size: 9pt; border-collapse: collapse"
				border="1" cellspacing="0" cellpadding="5">
				<tr>
					<td>
						FileName
					</td>
					<td>
						Description
					</td>
					<td>
						Status
					</td>
				</tr>
			</table>
			<br />
			<asp:Button runat=server ID="buttonTell" Text="Tell me how to get the server textbox values" OnClick="buttonTell_Click" OnClientClick="return buttonTell_Click()" />
			<br />
			<asp:Label runat=server ID="labelMsg" />
		</div>
	</form>
</body>

</html>

Second,

the list is the AjaxUploader queue table. It show the uploading files.

After all files are uploaded , the uploader will postback the form , fire the server error, and the page content will refresh.

So the temp queue table will dispear.

If you want to keep a table, you can use UploadAttachments control, and then customize the Items table

<%@ Page Language="C#" %>

<%@ Register TagPrefix="CuteWebUI" Namespace="CuteWebUI" Assembly="CuteWebUI.AjaxUploader" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

protected override void OnPreRender(EventArgs e)
	{
		base.OnPreRender(e);

//hide the default table
		UploadAttachments1.GetItemsTable().Visible = false;
		//bind the grid every times
		DataGrid1.DataSource = UploadAttachments1.Items;
		DataGrid1.DataBind();
		DataGrid1.Visible = UploadAttachments1.Items.Count > 0;
	}

protected void DataGrid1_ItemCommand(object sender, System.Web.UI.WebControls.DataGridCommandEventArgs e)
	{
		Guid guid = (Guid)DataGrid1.DataKeys[e.Item.ItemIndex];
		foreach (AttachmentItem item in UploadAttachments1.Items)
		{
			if (item.FileGuid == guid)
			{
				if (e.CommandName == "Download")
				{
					using (Stream str = item.OpenStream())
					{
						Response.AddHeader("Content-Disposition", "attachment; filename=\"" + item.FileName + "\"");
						Response.AddHeader("Content-Length", item.FileSize.ToString());
						byte[] buff = new byte[4096];
						while (true)
						{
							int rc = str.Read(buff, 0, buff.Length);
							if (rc == 0)
								break;
							Response.OutputStream.Write(buff, 0, rc);
						}
					}
				}

if (e.CommandName == "Remove")
				{
					item.Remove();
				}

break;
			}
		}
	}
	
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title>DataGridCS</title>
</head>
<body>
	<form id="form1" runat="server">
		<div>
			<CuteWebUI:UploadAttachments runat="server" ID="UploadAttachments1" UploadType="Flash">
			</CuteWebUI:UploadAttachments>
			<hr />
			<asp:DataGrid ID="DataGrid1" runat="server" AutoGenerateColumns="false" DataKeyField="FileGuid"
				OnItemCommand="DataGrid1_ItemCommand">
				<Columns>
					<asp:BoundColumn DataField="FileGuid" HeaderText="File Guid" />
					<asp:BoundColumn DataField="FileName" HeaderText="File Name" />
					<asp:BoundColumn DataField="FileSize" HeaderText="File Size" />
					<asp:ButtonColumn CommandName="Remove" Text="Remove" />
					<asp:ButtonColumn CommandName="Download" Text="Download" />
					<asp:TemplateColumn>
						<ItemTemplate>
							<asp:ImageButton runat="server" ID="removeImg" ImageUrl="remove.gif" CommandName="Remove" />
						</ItemTemplate>
					</asp:TemplateColumn>
				</Columns>
			</asp:DataGrid>
		</div>
	</form>
</body>
</html>

Regards,
Terry

03-03-2010, 10:32 AM 59133 in reply to 57852

senthilkumart
Joined on 03-01-2010
Posts 7

Re: Ajax-based-File-storage demo

Reply Quote

<CuteWebUI:UploadAttachments InsertText="Upload " runat="server"

ID="Attachments1" MultipleFilesUpload="true" ValidateOption-AllowedFileExtensions="jpeg,jpg,gif,png" ValidateOption-MaxSizeKB="200" OnAttachmentRemoveClicked="Attachments1_AttachmentDelete">

</CuteWebUI:UploadAttachments>

iam using above tage inside the div tag. after uploading files the div tag disappears.

is there any solution.