Welcome Guest Search | Active Topics | Sign In | Register

Problems with AjaxUploader in Modal Dialog Options
PSergei
Posted: Thursday, December 6, 2007 1:51:35 AM
Rank: Newbie
Groups: Member

Joined: 12/3/2007
Posts: 8
Hello Support,

I simple wanted to test ajaxUploader in modal dialog. I used your sample code and just put the
ajax uploader control from the "Standard Features" sample to the "Light Blue" dialog.
Got very strange results, Browse button doesn't work, half of the edit box is transparent.
Could you please check this and let me know?

Regards,
Sergei
eo_support
Posted: Thursday, December 6, 2007 6:55:03 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,217
Hi Sergei,

Try set the Dialog's ShadowDepth to 0. AJAXUploader and dialog shadow doesn't work together.

Thanks
PSergei
Posted: Thursday, December 6, 2007 12:38:07 PM
Rank: Newbie
Groups: Member

Joined: 12/3/2007
Posts: 8
Hello Support,

Thanks, proposed solution helped a bit - uploader control is not rendered correctly bug will doesn't work as expected. Browse button doesn't work, see the screenshot at http://prognimak.com/bug2.jpg. There is a focus frame inside edit box, actually when I click there then Browse dialog is open. Very odd behaviour...

Regards,
Sergei
eo_support
Posted: Thursday, December 6, 2007 12:50:22 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,217
Hum..that occurs sometimes and it is due to an IE bug. We do not know how to work around it yet. We are thinking about adding an additional property for you to manually set the text box width to address this situation. Would you mind to post your page source so that we can use it to verify whatever solution that we may implement?
PSergei
Posted: Thursday, December 6, 2007 2:11:39 PM
Rank: Newbie
Groups: Member

Joined: 12/3/2007
Posts: 8
Here is the dialog code I'm using.

Code: HTML/ASPX
<eo:Dialog runat="server" ID="dlgDetails" ControlSkinID="None" Width="300px" Height="120px"
	HeaderHtml="Menu Details" BorderStyle="Solid" CloseButtonUrl="00070101" BorderWidth="1px"
	BorderColor="#335C88" ShadowDepth="0">
	<HeaderStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 11px; background-image: url(00070104); padding-bottom: 3px; padding-top: 3px; font-family: tahoma">
	</HeaderStyleActive>
	<ContentStyleActive CssText="padding-left:5px;border-top: #335c88 1px solid; background-color: #e5f1fd">
	</ContentStyleActive>
	<ContentTemplate>
		<b>Menu Title</b><br />
		<asp:TextBox ID="txtTitle" runat="server" CssClass="input-box" Columns="50" MaxLength="50">
		</asp:TextBox><asp:RequiredFieldValidator ID="valTitle" runat="server" ControlToValidate="txtTitle"
			ErrorMessage="Please enter menu title" Display="static">*</asp:RequiredFieldValidator><br />
		<b>Menu URL</b><br />
		<asp:TextBox ID="txtUrl" runat="server" CssClass="input-box" Columns="50" MaxLength="200">
		</asp:TextBox><br />
		<b>Description</b><br />
		<asp:TextBox ID="txtDescription" runat="server" CssClass="input-box" Columns="50"
			TextMode="MultiLine" MaxLength="50">
		</asp:TextBox><br />
		<b>Active</b>
		<asp:CheckBox ID="chkActive" runat="server" CssClass="input-box" Checked="true"></asp:CheckBox> 
		<br />
		<b>No icon</b>
		<asp:CheckBox ID="chkDel" runat="server" Checked="true" /><br />
		<span>Upload menu icon - only GIF with size <= 20Kb are allowedeo:AJAXUploader runat="server" ID="uploader" TempFileLocation="~/images/temp" Width="280px"
			MaxDataSize="20" AllowedExtension=".gif" BrowseButtonText="..." UseLinkButton="False" 
			Rows="1" ClientSideOnError="alert('Only GIF and max 20K size are allowed');">
			<TextBoxStyle CssText="width:100px" />
		</eo:AJAXUploader>
		<br />
		<div style="text-align: center">
			<!-- submission of form -->
			<asp:Button ID="btnConfirm" runat="server" CssClass="general-button" Text="Save"></asp:Button>
		</div>
		<br>
		<asp:Label ID="lblMessage" runat="server" CssClass="error" EnableViewState="false"
			Style="background-color: Yellow; font-size: 12pt; font-weight: bold; border: solid 1px black;
			width: 100%; padding: 2px;" Visible="false"> </asp:Label>
		<fieldset id="validBlock" style="display: none" runat="server">
			<legend>Please correct the following errors!</legend>
			<asp:Label ID="lblError" runat="server" CssClass="error" EnableViewState="false"></asp:Label>
			<asp:ValidationSummary ID="valSum" Style="padding-left: 15px" runat="server" DisplayMode="List"
				ShowSummary="True" ForeColor="#990000"></asp:ValidationSummary>
		</fieldset>
	</ContentTemplate>
</eo:Dialog>
eo_support
Posted: Thursday, December 6, 2007 3:07:38 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,217
Hi,

The code you posted works fine here. Would you mind to post the full page?

Thanks
PSergei
Posted: Thursday, December 6, 2007 5:58:11 PM
Rank: Newbie
Groups: Member

Joined: 12/3/2007
Posts: 8
eo_support wrote:
Hi,

The code you posted works fine here. Would you mind to post the full page?

Thanks


This code is a part of user control used in <asp:Content>. So it would be hard to use it ouside.

You can simple take the file
"C:\Program Files\Essential Objects\EO.Web Controls 2007.2\Net20\Samples\VB\Demos\Dialog\Designs\Light Blue\Demo.ascx"

and put the following code there:

Code: HTML/ASPX
<%@ Control language="C#" AutoEventWireup="false" CodeFile="Demo.ascx.cs" Inherits="EO.Web.Demo.Demos.Dialog.Designs.Light_Blue.Demo" %>
<%@ Register TagPrefix="eo" NameSpace="EO.Web" Assembly="EO.Web" %>
<p>
In addition to style properties, this dialog also has <b>CloseButtonUrl</b>,
<b>MinimizeButtonUrl</b>, <b>RestoreButtonUrl</b> and <b>ResizeImageUrl</b>
set. These images create the minimize/restore button, close button and the
resizing grip.
</p>
<eo:Dialog runat="server" id="Dialog1" ControlSkinID="None" Width="300px" Height="200px" HeaderHtml="Dialog Header"
	BorderStyle="Solid" CloseButtonUrl="00070101" MinimizeButtonUrl="00070102" AllowResize="True"
	BorderWidth="1px" ShadowColor="LightGray" BorderColor="#335C88" RestoreButtonUrl="00070103"
	ShadowDepth="0" ResizeImageUrl="00020014">
	<HeaderStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 11px; background-image: url(00070104); padding-bottom: 3px; padding-top: 3px; font-family: tahoma"></HeaderStyleActive>
	<ContentStyleActive CssText="border-top: #335c88 1px solid; background-color: #e5f1fd"></ContentStyleActive>
	
	<ContentTemplate>
	<eo:AJAXUploader runat="server" id="AJAXUploader1" Width="400px" TempFileLocation="~/eo_upload" MaxDataSize="30000">
	</eo:AJAXUploader>
	</ContentTemplate>

</eo:Dialog>
<p>
	<a href="javascript:eo_GetObject('Dialog1').show(false);">Show Modeless</a>
</p>
<p>
	<a href="javascript:eo_GetObject('Dialog1').show(true);">Show Modal</a>
</p>


This doesn't work for me. BTW, I'm using IE7


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.