<P align=left>Please see this post for the latest version: http://forums.ext.net/showthread.php?postid=8229.aspx


I know there's been talk about this in the forums before, but has anyone created the file upload dialog UX? The one here: http://www.max-bazhenov.com/dev/uplo...-2.0/index.php

I've been attempting to do it, but as this is my first ExtJS experience, it's slow going and I haven't made much progress. I know server controls very well (having authored multiple ones myself - include richtextboxes), but I'm still familiarizing myself w/ the ExtJS + Coolite APIs.

I have it so I can drop in the control into the designer and it appears, but at runtime IE gives me a javascript error "Invalid source HTML for this operation." On Firefox 3.0, it appears, but the dialog is squished down. When you resize it, it takes on its correct min width/height.

I figure this is probably a version issue since the javascript I pulled from that site is for 2.0 and ExtJS is on 2.2. However, I don't know where to begin to address the issue.

Can anyone help? Here's the code I have so far:

using System;
using System.Web.UI;
using System.Drawing;
using System.ComponentModel;
using Coolite.Ext.Web;

[assembly: WebResource("ServerControls.Resources.Scripts.Ext.ux.UploadDialog.packed.js", "text/javascript")]
[assembly: WebResource("ServerControls.Resources.Scripts.Ext.ux.UploadDialog.js", "text/javascript")]

namespace ServerControls {

    [ToolboxData("<{0}:FileUploadDialog runat=\"server\" Title=\"Upload Files\" Collapsible=\"false\" Icon=\"None\" />")]
    [ToolboxBitmap(typeof(FileUploadDialog), "Resources.ToolboxIcons.window.bmp")]
    [Designer(typeof(FileUploadDialogDesigner))]
    [Description("Specialized dialog for uploading files.")]
    [InstanceOf(ClassName = "Ext.ux.UploadDialog.Dialog")]
    [ClientScript(
        Type = typeof(FileUploadDialog),
        WebResource = "ServerControls.Resources.Scripts.Ext.ux.UploadDialog.packed.js",
        WebResourceDebug = "ServerControls.Resources.Scripts.Ext.ux.UploadDialog.js"
    )]
    public class FileUploadDialog : Window {
        protected override void OnBeforeClientInit(Observable sender) {
            base.OnBeforeClientInit(sender);
        }
        protected override void OnAfterClientInit(Observable sender) {
            base.OnAfterClientInit(sender);
        }
    }
}
Here's the designer code:

using System;
using System.ComponentModel;
using System.ComponentModel.Design;
using Coolite.Ext.Web;

namespace ServerControls {
    internal class FileUploadDialogDesigner : ExtWebControlDesigner {
        public override bool AllowResize {
            get {
                return false;
            }
        }

        public override string GetDesignTimeHtml() {
            if (((FileUploadDialog)this.Control).Hidden) {
                return string.Empty;
            }
            return base.CreatePlaceHolderDesignTimeHtml();
        }

        private DesignerActionListCollection actionLists;
        public override DesignerActionListCollection ActionLists {
            get {
                if (actionLists == null) {
                    actionLists = new DesignerActionListCollection();
                    actionLists.Add(new FileUploadDialogActionList(this.Component));
                }
                return actionLists;
            }
        }
    }

    internal class FileUploadDialogActionList : WindowActionList {
        public FileUploadDialogActionList(IComponent component) : base(component) { 
        }

        public override DesignerActionItemCollection GetSortedActionItems() {
            return base.GetSortedActionItems();
        }
    }
}
Sample web content page:

<%@ Page Title="File Upload Dialog" Language="C#" MasterPageFile="~/site.master" AutoEventWireup="true" CodeBehind="fileUploadDialog.aspx.cs" Inherits="Sandbox.fileUploadDialog" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<%@ Register Assembly="ServerControls" Namespace="ServerControls" TagPrefix="ux" %>

<asp:Content ID="content" ContentPlaceHolderID="content" runat="server">

    <ext:ScriptManager ID="ScriptManager" runat="server" />
    <br />

    <ux:FileUploadDialog ID="FileUploadDialog1" runat="server" Collapsible="True" Icon="Cart" Title="Upload Files" Draggable="true" Floating="true" Maximizable="True" Modal="True" ShowOnLoad="False" />

    <ext:Button ID="Button1" runat="server" Icon="ReportAdd" Text="Upload Files">
        <Listeners>
            <Click Handler="#{FileUploadDialog1}.show()" />
        </Listeners>
    </ext:Button>

</asp:Content>
Thanks!