Rank: Advanced Member
Groups: Member
Joined: 8/4/2007
Posts: 42
|
I am trying to recreate a CompositeControl we had previously written using Infragistic's Editor control using your new Editor component. Your editor is much better cross browser. Efectively we're trying to rewrite your Demo "Upload From Toolbar" as a CompositeControl instead of a UserControl. Your controls instantiate in our test and display problem and partially perform. The AJAXUploader starts the transfer but the FileUpload event never fires. In fact none of the Events seem to want to fire. The uploader leaves the tempory eoupload.xxx files in the upload directory and never finished it's cleanup. I just can't figure out why the events won't hookup. Here's the code for the control if there is anything you can spot. Thanks file ArticlePost.cs
Code: C#
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.IO;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using EO.Web;
namespace ArticlePost.Controls
{
public class FileListTemplate : ITemplate
{
ListItemType templateType;
public FileListTemplate(ListItemType type)
{
templateType = type;
}
public void InstantiateIn(System.Web.UI.Control container)
{
Label lbl = new Label();
lbl.ID = "lblFileName";
container.Controls.Add(lbl);
LiteralControl lc = new LiteralControl();
lc.Text = "(";
container.Controls.Add(lc);
LinkButton lb = new LinkButton();
lb.ID = "lblDelete";
lb.Text = "Delete";
container.Controls.Add(lb);
lc = new LiteralControl();
lc.Text = ") ";
container.Controls.Add(lc);
}
}
public class ProgressTemplate : ITemplate
{
ListItemType templateType;
public ProgressTemplate(ListItemType type)
{
templateType = type;
}
public void InstantiateIn(System.Web.UI.Control container)
{
LiteralControl lc = new LiteralControl();
lc.Text = "<table cellSpacing\"0\" cellPadding=\"0\" width=\"492\" border=\"0\">\r\n";
lc.Text += "<tr>\r\n";
lc.Text += "<td style=\"padding-top:5px\">\r\n";
container.Controls.Add(lc);
EO.Web.ProgressBar pb = new EO.Web.ProgressBar();
pb.ID = "ProgressBar";
pb.ControlSkinID = "Windows_XP";
container.Controls.Add(pb);
lc = new LiteralControl();
lc.Text = "</td>\r\n";
lc.Text = "</tr>\r\n";
lc.Text += "<tr>\r\n";
lc.Text += "<td>\r\n";
container.Controls.Add(lc);
PlaceHolder ph = new PlaceHolder();
ph.ID = "ProgressTextPlaceHolder";
container.Controls.Add(ph);
lc = new LiteralControl();
lc.Text = "</td>\r\n";
lc.Text = "</tr>\r\n";
lc.Text += "</table>\r\n";
container.Controls.Add(lc);
}
}
//[DefaultProperty("Text")]
[ToolboxData("<{0}:ArticlePost runat=server></{0}:ArticlePost>")]
public class ArticlePost : CompositeControl
{
[Bindable(true)]
[Category("Appearance")]
[DefaultValue("")]
[Localizable(true)]
private Editor _oHtmlEditor;
private AJAXUploader _oUploader;
private Repeater _oRepeater;
public ArticlePost()
{
}
public string Text
{
get
{
String s = (String)ViewState["Text"];
return ((s == null) ? String.Empty : s);
}
set
{
ViewState["Text"] = value;
}
}
public override ControlCollection Controls
{
get
{
EnsureChildControls();
return base.Controls;
}
}
protected override void OnPreRender(EventArgs e)
{
EnsureChildControls();
//Get the toolbar control
EO.Web.ToolBar toolBar = (EO.Web.ToolBar)_oHtmlEditor.HeaderContainer.Controls[1];
//Get the uploader control
AJAXUploader uploader = (AJAXUploader)_oHtmlEditor.FooterContainer.FindControl("AJAXUploader1");
//Set the uploader's StartToolBarButton and StopToolBarButton.
//These two properties associate the toolbar buttons to the
//uploader
uploader.LayoutTemplate = new ProgressTemplate(ListItemType.Item);
uploader.StartToolBarButton = toolBar.ClientID + ":" + "Upload";
uploader.StopToolBarButton = toolBar.ClientID + ":" + "CancelUpload";
base.OnPreRender(e);
}
protected override void CreateChildControls()
{
CreateEditor();
base.CreateChildControls();
ChildControlsCreated = true;
}
private void CreateEditor()
{
// Create the Editor control.
_oHtmlEditor = new Editor();
_oHtmlEditor.ID = "HtmlEditor1";
PopulateToolbar();
this.Controls.Add(_oHtmlEditor);
}
private void PopulateToolbar()
{
_oHtmlEditor.ToolBarSet = EditorToolBarSet.Custom;
_oHtmlEditor.ToolBarItems = "Bold,Italic,Underline,,SuperScript,SubScript,,Cut,Copy,Paste,,Undo,Redo,AlignLeft,AlignCenter,AlignRight,AlignJustify,,Indent,Outdent,,BulletList,NumberedList,,InsertLine;" +
"ForeColor,BackColor,,InsertOrEditTable,,InsertOrEditLink,RemoveLink,,Find,InsertOrEditAnchor,InsertOrEditImage;" +
"Fonts,FontSizes,Styles,SpellCheck";
//Get the toolbar control
EO.Web.ToolBar toolBar = (EO.Web.ToolBar)_oHtmlEditor.HeaderContainer.Controls[1];
ToolBarItem tbiAttachment = new ToolBarItem();
toolBar.Items.Add(tbiAttachment);
tbiAttachment.Text = "";
tbiAttachment.ToolTip="Attachments";
tbiAttachment.CommandName="Upload";
tbiAttachment.ImageUrl="00101059";
tbiAttachment = new ToolBarItem();
toolBar.Items.Add(tbiAttachment);
tbiAttachment.Text = "Cancel Upload";
tbiAttachment.ToolTip = "Cancel Upload";
tbiAttachment.CommandName = "CancelUpload";
tbiAttachment.ImageUrl = "00101059";
ControlCollection footer = _oHtmlEditor.FooterContainer.Controls;
AJAXPostedFileList fl = new AJAXPostedFileList();
fl.ID = "AJAXPostedFileList1";
footer.Add(fl);
CallbackPanel cb = new CallbackPanel();
cb.ID = "CallbackPanel1";
cb.Style.Add("clear", "both");
cb.Triggers.Add(new CallbackTrigger("AJAXUploader1", null));
cb.Triggers.Add(new CallbackTrigger("Repeater1", null));
footer.Add(cb);
Panel pnl = new Panel();
pnl.ID = "Panel1";
pnl.Visible = false;
LiteralControl lit = new LiteralControl();
lit.Text = "Attachments:";
pnl.Controls.Add(lit);
_oRepeater = new Repeater();
_oRepeater.ID = "Repeater1";
_oRepeater.ItemTemplate = new FileListTemplate(ListItemType.Item);
_oRepeater.ItemDataBound += new RepeaterItemEventHandler(this.Repeater1_ItemDataBound);
_oRepeater.ItemCommand += new RepeaterCommandEventHandler(this.Repeater1_ItemCommand);
pnl.Controls.Add(_oRepeater);
cb.Controls.Add(pnl);
lit = new LiteralControl();
lit.Text = "<div id=\"uploader_div\" style=\"display:none;\">";
footer.Add(lit);
_oUploader = new AJAXUploader();
_oUploader.ID = "AJAXUploader1";
_oUploader.EnableViewState = true;
_oUploader.Width = new Unit("492px");
_oUploader.AutoUpload = true;
_oUploader.HideDisabledToolBarButton = true;
_oUploader.TempFileLocation = "~";
_oUploader.FinalFileLocation = "~";
_oUploader.FinalFileList = "AJAXPostedFileList1";
_oUploader.AutoPostBack = true;
_oUploader.ClientSideOnStart = "uploader_start";
_oUploader.ClientSideOnDone = "uploader_stop";
_oUploader.ClientSideOnCancel = "uploader_stop";
_oUploader.FileUploaded += new EventHandler(this.AJAXUploader1_FileUploaded);
footer.Add(_oUploader);
lit = new LiteralControl();
lit.Text = "</div>";
footer.Add(lit);
//Bunch of style stuff tyo make it pretty
_oHtmlEditor.TabButtonStyles.HoverStyle.CssText = "border-right: #335ea8 1px solid; padding-right: 6px; border-top: #335ea8 1px solid; padding-left: 6px; font-size: 12px; padding-bottom: 2px; border-left: #335ea8 1px solid; padding-top: 2px; border-bottom: #335ea8 1px solid; font-family: tahoma; background-color: #c2cfe5";
_oHtmlEditor.TabButtonStyles.NormalStyle.CssText = "border-right: #335ea8 1px; padding-right: 7px; border-top: #335ea8 1px; padding-left: 7px; font-size: 12px; padding-bottom: 3px; border-left: #335ea8 1px; padding-top: 3px; border-bottom: #335ea8 1px; font-family: tahoma; background-color: white";
_oHtmlEditor.TabButtonStyles.SelectedStyle.CssText = "border-right: #335ea8 1px solid; padding-right: 6px; border-top: #335ea8 1px solid; padding-left: 6px; font-size: 12px; padding-bottom: 2px; border-left: #335ea8 1px solid; padding-top: 2px; border-bottom: #335ea8 1px solid; font-family: tahoma; background-color: white";
_oHtmlEditor.FooterStyle.CssText = "border-right: gray 1px solid; padding-right: 2px; border-top: gray 1px; padding-left: 2px; padding-bottom: 2px; border-left: gray 1px solid; padding-top: 2px; border-bottom: gray 1px solid; background-color: #fafafa";
_oHtmlEditor.BreadcrumbItemStyle.CssText = "border-right: darkgray 1px solid; padding-right: 3px; border-top: darkgray 1px solid; margin-top: 1px; padding-left: 3px; font-size: 12px; padding-bottom: 1px; border-left: darkgray 1px solid; padding-top: 1px; border-bottom: darkgray 1px solid; font-family: tahoma";
_oHtmlEditor.EmoticonStyle.CssText = "background-color:white;border-bottom-color:#c5d3ed;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#c5d3ed;border-left-style:solid;border-left-width:1px;border-right-color:#c5d3ed;border-right-style:solid;border-right-width:1px;border-top-color:#c5d3ed;border-top-style:solid;border-top-width:1px;padding-bottom:2px;padding-left:2px;padding-right:2px;padding-top:2px;";
_oHtmlEditor.BreadcrumbItemHoverStyle.CssText = "border-right: darkgray 1px solid; padding-right: 3px; border-top: darkgray 1px solid; margin-top: 1px; padding-left: 3px; font-size: 12px; padding-bottom: 1px; border-left: darkgray 1px solid; padding-top: 1px; border-bottom: darkgray 1px solid; font-family: tahoma; background-color:#e0e0e0;";
_oHtmlEditor.HeaderStyle.CssText = "border-right: gray 1px solid; border-top: gray 1px solid; border-left: gray 1px solid; border-bottom: gray 1px";
_oHtmlEditor.BreadcrumbItemSeparatorStyle.CssText = "width: 3px; height: 10px";
_oHtmlEditor.EmoticonDropDownStyle.CssText = "border-top: gray 1px solid; border-right: gray 1px solid; padding-right: 2px; border-top: gray 1px; padding-left: 2px; padding-bottom: 2px; border-left: gray 1px solid; padding-top: 2px; border-bottom: gray 1px solid; background-color: #fafafa";
_oHtmlEditor.BreadcrumbLabelStyle.CssText = "padding-right: 6px; padding-left: 6px; font-size: 12px; padding-top: 1px; font-family: tahoma";
_oHtmlEditor.BreadcrumbDropDownStyle.CssText = "border-top: gray 1px solid; border-right: gray 1px solid; padding-right: 2px; border-top: gray 1px; padding-left: 2px; padding-bottom: 2px; border-left: gray 1px solid; padding-top: 2px; border-bottom: gray 1px solid; background-color: #fafafa";
_oHtmlEditor.EditAreaStyle.CssText = "border-right: gray 1px solid; padding-right: 0px; border-top: gray 1px solid; padding-left: 0px; padding-bottom: 0px; border-left: gray 1px solid; padding-top: 0px; border-bottom: gray 1px solid";
}
//Event Handlers
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
AJAXPostedFile file = (AJAXPostedFile)e.Item.DataItem;
if (file != null)
{
Label label = (Label)e.Item.FindControl("lblFileName");
label.Text = Path.GetFileName(file.FinalFileName);
}
}
protected void Repeater1_ItemCommand(object sender, RepeaterCommandEventArgs e)
{
//Find CallBackPanel
CallbackPanel cp = (CallbackPanel)_oHtmlEditor.FooterContainer.FindControl("CallBackpanel1");
//Find the AJAXPostedFilelist
AJAXPostedFileList list = (AJAXPostedFileList)cp.FindControl("AJAXPostedFileList1");
list.Delete(e.Item.ItemIndex);
UpdateFileList(cp, list);
}
private void AJAXUploader1_FileUploaded(object sender, System.EventArgs e)
{
//Find CallBackPanel
CallbackPanel cp = (CallbackPanel)_oHtmlEditor.FooterContainer.FindControl("CallBackpanel1");
//Find the AJAXPostedFilelist
AJAXPostedFileList list = (AJAXPostedFileList)cp.FindControl("AJAXPostedFileList1");
UpdateFileList(cp, list);
}
private void UpdateFileList(CallbackPanel cp, AJAXPostedFileList list)
{
//Refresh the Repeater
Repeater repeater = (Repeater)cp.FindControl("Repeater1");
repeater.DataSource = list.Items;
repeater.DataBind();
Panel panel = (Panel)cp.FindControl("Panel1");
panel.Visible=(list.Items.Length > 0);
}
}
}
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,193
|
Hi,
Try to call EnsureChildControls in your control's Init event. All the child controls must be initialized in a very early stage in order to work correctly.
Thanks!
|
Rank: Advanced Member
Groups: Member
Joined: 8/4/2007
Posts: 42
|
eo_support wrote:Hi,
Try to call EnsureChildControls in your control's Init event. All the child controls must be initialized in a very early stage in order to work correctly.
Thanks! Well you'll note the ControlCollection override:
Code: C#
public override ControlCollection Controls
{
get
{
EnsureChildControls();
return base.Controls;
}
}
Which is as early as you can get since _anything_ that references the controls collection calls EnsureChildControls(). But I added an ovveride for OnInit with EnsureChildControls() just to be sure and it still won't call the events.
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,193
|
Hi,
Is it possible for you to provide a stripped down test solution that demonstrates the problem? We will have to debug into it to see where the problem is. We will PM you as to where to send the test project.
Thanks!
|
Rank: Advanced Member
Groups: Member
Joined: 8/4/2007
Posts: 42
|
That's what I worked through this morning. It appears the problem was putting the AJAXUploader control in the Editor.FooterContainer. The events don't bubble for some reason. If added to the CompositeControl.Controls everything works. It just isn't neatly contained in the Editor. I can live with this solution I think.
Thanks much for your usual swift reply. You're the best.
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,193
|
I see. Thanks for the update!
|
Rank: Advanced Member
Groups: Member
Joined: 8/4/2007
Posts: 42
|
I found the last piece and was able to get the Uploader and progressbar etc in the footercontainer. What was needed was to implement an ITemplate class that instantiates the controls and put the Event handlers in the ITemplate itself. Then it can handle the events generated in the footer correctly.
|