Rating Control: code

Showing posts with label code. Show all posts

Wednesday, March 28, 2012

Programatically Create Tab Container and Tab Panels

Hi,

How can I create a tab container and subsequent tab panels within it using C# in the code behind?

Any help would be much appreciated.

Hello,

You can you the PlaceHolder Control to add the TabContainer on the page, like so: make sure to add the reference at the top - using AjaxControlToolkit;

 TabContainer container =new TabContainer(); TabPanel panel1 =new TabPanel(); TabPanel panel2 =new TabPanel(); TextBox txtOne =new TextBox(); txtOne.ID ="txtOne"; txtOne.Text ="Example Text"; panel1.HeaderText ="This is Header 1 Text"; panel1.Controls.Add(txtOne); panel2.HeaderText =" This is Header 2 Text"; container.Tabs.Add(panel1); container.Tabs.Add(panel2); PlaceHolder1.Controls.Add(container);

Hope this helps.

Yep that was perfect...thanks for this!

Programatically Expand CollapsiblePanel (With Lastest ToolKit)

The issue I am experiencing is due to upgrading to the latest ToolKit. I previously was able to use this code on a postback to expand a collapsible panel.

Previous Code:
Dim clp2 As CollapsiblePanelProperties = CollapsiblePanelExtender2.GetTargetProperties(Panel2)
clp2.ClientState =True
clp2.Collapsed =False

However I do understand that with the upgrade the Properties sections under each of the ToolKit controls is no longer valid. I personally liked the ability to place multiple <atlasToolKit:Properties> tags underneath ONE <atlasToolKit:CollapsiblePanel> tag. Why did you remove that?? It was easy to migrate but a hassle in regards to having to set up a new tag for each time. Anyhow... off of the soapbox.

Current Code:
Dim clp2As CollapsiblePanelExtender = CollapsiblePanelExtender2
clp2.ClientState =True
clp2.Collapsed =False

This fails to expand the Panel on a postback. Any help or solutions?

JoeWeb

I believe the ClientState value needs to be lower cased and quoted as per this post:http://forums.asp.net/thread/1325048.aspx.

Yeah after playing around with it for a little bit... I actually discovered that the following code fixed it.

Dim clp2As CollapsiblePanelExtender = CollapsiblePanelExtender2
clp2.ClientState =False
clp2.Collapsed =False

All that is different is that I set both to false.

Anyhow I figured it out about a week ago sorry I didn't post an update. Thanks!

JoeWeb

Programmatically adding a ConfirmButtonExtender

Hi,

I cannot get my ConfirmButtonExtender to work when I add it from the code behind.

A javascript page error occurs the page loads:

Line: 2829
Char:23
Error: Sys.ArgumentException: Value must not be null for Controls and Behaviors.
Parameter name: element
Code:0

---------------

Here is the code:

-- .asp snippet----

 <asp:ScriptManager ID="ScriptMan1" runat="server"> </asp:ScriptManager> <asp:Panel ID="Panel1" runat="server"> </asp:Panel>

---.asp.cs snippet----

protected void Page_Load(object sender, EventArgs e) { Button button =new Button(); button.Text ="Click Me"; Panel1.Controls.Add(button); AjaxControlToolkit.ConfirmButtonExtender confirmDeleteExt =new AjaxControlToolkit.ConfirmButtonExtender(); confirmDeleteExt.TargetControlID = button.UniqueID; confirmDeleteExt.ConfirmText ="Are you sure?"; Panel1.Controls.Add(confirmDeleteExt); }

----------

It's nothing special, but what am I missing?!

I am dynamically building the page, so beginning with the button on the page is not an option (which works no problem).

Thanks!

Your code works fine on my computer.

OK,

Thanks for your reply, kipo, looking at it again it seems that the error only seems to occur when using a masterpage.

Does it still work for you if you put all of it into a masterpage?

I've tried to put your code in page which is using MasterPage and it doesn't work, so you were right - error is occuring only with MasterPage. But, you can achieve it with this code:

Button button = new Button();
button.Text = "Click Me";
button.ID = "button1";
Panel1.Controls.Add(button);

AjaxControlToolkit.ConfirmButtonExtender confirmDeleteExt = new AjaxControlToolkit.ConfirmButtonExtender();
confirmDeleteExt.TargetControlID = "button1";
confirmDeleteExt.ConfirmText = "Are you sure?";
Panel1.Controls.Add(confirmDeleteExt);

Excellent! Big Smile

Thanks a lot for your help!

I thought this problem was related to IDs, but is this a bug or is this by design?

Programmatically adding hoverbehavior

I'm trying to convert some declarative code to its programmatic equivalent. I have the following. Am I missing something?

// <control targetElement="objectElement">
var objectControl =new Web.UI.Control(objectElement);
objectControl.initialize();
var objectControlBehaviors = objectControl.get_behaviors();

// <hoverBehavior unhoverDelay="500" hoverElement="popup">
var hoverBehavior =new Web.UI.HoverBehavior();
hoverBehavior.set_unhoverDelay(500);
hoverBehavior.set_hoverElement(popup);
objectControlBehaviors.add(hoverBehavior);

// <setProperty target="popupBehavior" property="PositioningMode" value="Absolute" />
var action =new Web.SetPropertyAction();
action.set_target(popupBehavior);
action.set_property("PositioningMode");
action.set_value("Absolute");
hoverBehavior.hover.addAction(action);

// <setProperty target="popupBehavior" property="x" value="50" />
var action1 =new Web.SetPropertyAction();
action1.set_target(popupBehavior);
action1.set_property("x");
action1.set_value("50");
hoverBehavior.hover.addAction(action1);

// <setProperty target="popupBehavior" property="y" value="50" />
var action2 =new Web.SetPropertyAction();
action2.set_target(popupBehavior);
action2.set_property("y");
action2.set_value("50");
hoverBehavior.hover.addAction(action2);

// <invokeMethod target="popupBehavior" method="show" />
var action3 =new Web.InvokeMethodAction();
action3.set_target(popupBehavior);
action3.set_method("show");
hoverBehavior.hover.addAction(action3);

// <unhover>
var unhoverBehavior =new Web.UI.HoverBehavior();
objectControlBehaviors.add(unhoverBehavior);

// <invokeMethod target="popupBehavior" method="hide" />
var action4 =new Web.InvokeMethodAction();
action4.set_target(popupBehavior);
action4.set_method("hide");
unhoverBehavior.unhover.addAction(action4);

Any help appreciated...

Hi,

it seems that you missed to call the initialize() method of the HoverBehavior.

You are missing the "popupBehavior" target, which needs to be attached, with the "id" set to "popupBehavior" to the <behaviors> tag under the <control> reference that you want to "pop up." For example, if you are wanting the "objectElement" to pop up, you would change that control reference in the following way:

<control targetElement="objectElement"> <behaviors> <popupBehavior id="popupBehavior" ..the rest of the properties... /> </behaviors> </control>

I was desperately looking on how to do this... and finally, I found the way... you got me started, so this is how to do it:

var test = document.getElementById("test");var p = document.getElementById("p");var popup =new Sys.UI.Control( p );

popup.initialize();

var objectControl =new Sys.UI.HyperLink(test);

objectControl.initialize();

var objectControlBehaviors = objectControl.get_behaviors();var pb =new Sys.UI.PopupBehavior();

pb.setOwner( popup );

pb.set_parentElement( objectControl );

pb.set_positioningMode(

"TopRight" );var invoke =new Sys.InvokeMethodAction();

invoke.set_target(pb);

invoke.set_method(

"show");var invokeu =new Sys.InvokeMethodAction();

invokeu.set_target(pb);

invokeu.set_method(

"hide");var behavior =new Sys.UI.HoverBehavior();

behavior.setOwner( objectControl );

behavior.initialize();

behavior.hover.addAction( invoke );

behavior.unhover.addAction( invokeu );

objectControlBehaviors.add( behavior );

And actually, here is the final version:

function

setHover( link, domPopup )

{

var popup =new Sys.UI.Control( domPopup );

popup.initialize();

var objectControl =new Sys.UI.HyperLink( link );

objectControl.initialize();

controls[index] = objectControl;

index++;

var objectControlBehaviors = objectControl.get_behaviors();var pb =new Sys.UI.PopupBehavior();

pb.setOwner( popup );

pb.set_parentElement( link );

pb.set_positioningMode( Sys.UI.PositioningMode.Absolute );

pb.set_x( 45 );

pb.set_y( 0 );

var invoke =new Sys.InvokeMethodAction();

invoke.set_target(pb);

invoke.set_method(

"show");var invokeu =new Sys.InvokeMethodAction();

invokeu.set_target(pb);

invokeu.set_method(

"hide");var behavior =new Sys.UI.HoverBehavior();

behavior.setOwner( objectControl );

behavior.set_hoverElement( domPopup );

behavior.initialize();

behavior.hover.addAction( invoke );

behavior.hover.add( populatePanel );

behavior.unhover.addAction( invokeu );

objectControlBehaviors.add( behavior );

}

Additional notes:

The popup div has to specific position:absolute. This might be a bug since you do not have to do that with the declarative syntax.

If you are dynamically creating and destroying these, make sure to do something like:

function

destroy()

{

for(var i = 0; i < index; i++ )

{

var b = controls[i].get_behaviors();

b =

null;

}

index = 0;

}

(I'm sure the right thing is to destroy the objects, but this works for my demo in an hour)

Hope this helps...

I'm getting closer whoever started this I'm trying very hard to make danz stuff work.

I'm getting closer whoever started this I'm trying very hard to make danz stuff work. First post was better Danz

Here you go, tested on firefox and ie6:

function CreateHoverOptions(popup_id, parentid, behaviorid, delayMS)
{
var popup_element = getObj(popup_id);
var popup_control = new Sys.UI.Control($(popup_id));
var parent = new Sys.UI.Control($(parentid));
var PopOptions = new Sys.UI.PopupBehavior();

PopOptions.set_id(behaviorid);
PopOptions.set_parentElement(getObj(parentid));
PopOptions.set_positioningMode("TopLeft");
popup_control.get_behaviors().add(PopOptions);

var HoverOptions = new Sys.UI.HoverBehavior();
HoverOptions.set_unhoverDelay(delayMS);
HoverOptions.set_hoverElement(popup_element);
parent.get_behaviors().add(HoverOptions);

var hoverAction = new Sys.InvokeMethodAction();
hoverAction.set_target(PopOptions);
hoverAction.set_method("show");
HoverOptions.hover.addAction(hoverAction);

var unhoverAction = new Sys.InvokeMethodAction();
unhoverAction.set_target(PopOptions);
unhoverAction.set_method("hide");
HoverOptions.unhover.addAction(unhoverAction);

PopOptions.initialize();
HoverOptions.initialize();
popup_control.initialize();
parent.initialize();
}

HOW to USE:
1. call following method in pageLoad()
CreateHoverOptions("OPTIONS", "image4", "beh", 1000);

HTML:
<div>
<img id="image4" src="http://pics.10026.com/?src=../images/tlogo.gif" />
</div>

<div id="OPTIONS" style="visibility:hidden;display:none;">
<div style="background-color:Yellow;">
<a href="http://links.10026.com/?link=javascript: alert('delete this pic');">[x]</a>
<a href="http://links.10026.com/?link=#">[e]</a>
</div>
</div

Has anyone updated the above code to the latest Ajax beta 1 or beta 2 version??

Thanks, Greg Benoit

Programmatically Create AnimationExtender

I have not found any previous posts addressing this issue. I need to create an AnimationExtender programmatically from the code behind. Does anyone know how to do this? For instance using the example provided on the Toolkit page:

1<ajaxToolkit:AnimationExtender id="ace" runat="server" TargetControlID="btnHelp">2 <Animations>3 <OnLoad><OpacityAction AnimationTarget="info" Opacity="0" /></OnLoad>4 <OnClick>5 <Sequence>6 <StyleAction AnimationTarget="flyout" Attribute="display" Value="block"/>7 <Parallel AnimationTarget="flyout" Duration=".3" Fps="25">8 <Move Horizontal="150" Vertical="-50" />9 <Resize Width="260" Height="280" />10 <Color AnimationTarget="flyout" StartValue="#AAAAAA" EndValue="#FFFFFF" Property="style" PropertyKey="backgroundColor" />11 </Parallel>12 <ScriptAction Script="Cover($get('flyout'), $get('info'), true);" />13 <StyleAction AnimationTarget="info" Attribute="display" Value="block"/>14 <FadeIn AnimationTarget="info" Duration=".2"/>15 <StyleAction AnimationTarget="flyout" Attribute="display" Value="none"/>16 <StyleAction AnimationTarget="info" Attribute="height" value="auto" />17 <Parallel Duration=".5">18 <Color AnimationTarget="info" StartValue="#666666" EndValue="#FF0000" Property="style" PropertyKey="color" />19 <Color AnimationTarget="info" StartValue="#666666" EndValue="#FF0000" Property="style" PropertyKey="borderColor" />20 </Parallel>21 <Parallel Duration=".5">22 <Color AnimationTarget="info" StartValue="#FF0000" EndValue="#666666" Property="style" PropertyKey="color" />23 <Color AnimationTarget="info" StartValue="#FF0000" EndValue="#666666" Property="style" PropertyKey="borderColor" />24 <FadeIn AnimationTarget="btnCloseParent" MaximumOpacity=".9" />25 </Parallel>26 </Sequence>27 </OnClick>28 </Animations>29 </ajaxToolkit:AnimationExtender>30 <ajaxToolkit:AnimationExtender id="AnimationExtender1" runat="server" TargetControlID="btnClose">31 <Animations>32 <OnClick>33 <Sequence>34 <StyleAction AnimationTarget="info" Attribute="overflow" Value="hidden"/>35 <Parallel AnimationTarget="info" Duration=".3" Fps="15">36 <Scale ScaleFactor="0.05" Center="true" ScaleFont="true" FontUnit="px" />37 <FadeOut />38 </Parallel>39 <StyleAction AnimationTarget="info" Attribute="display" Value="none"/>40 <StyleAction AnimationTarget="info" Attribute="width" Value="250px"/>41 <StyleAction AnimationTarget="info" Attribute="height" Value=""/>42 <StyleAction AnimationTarget="info" Attribute="fontSize" Value="12px"/>43 <StyleAction AnimationTarget="btnCloseParent" Attribute="opacity" value="0" />44 <StyleAction AnimationTarget="btnCloseParent" Attribute="filter" value="alpha(opacity=0)" />4546 </Sequence>47 </OnClick>48 <OnMouseOver>49 <Color Duration=".2" StartValue="#FFFFFF" EndValue="#FF0000" Property="style" PropertyKey="color" />50 </OnMouseOver>51 <OnMouseOut>52 <Color Duration=".2" EndValue="#FFFFFF" StartValue="#FF0000" Property="style" PropertyKey="color" />53 </OnMouseOut>54 </Animations>55 </ajaxToolkit:AnimationExtender>

How would you create this AnimationExtender from a code behind? I am using VB.NET, but generally I have no problem reading and converting C# code.

You can add the Animation Extender programmatically like this

ace.Animations = 'the actual animation that has to appear'

Page.Controls.AddAt(0,ace);
}
</script>

For more information please look at this url

http://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=7408

Sorry for the lateness of this reply. I figured out how to do it through the code behind. You basically just write the XML for the behaviors into a string builder then create a new Animation Extender and assing the XML to the .Animations property.

if possible, can you share the code?

thanks

It has been a while since I did this. I got it to work, but did not end up using it as you can only have a few on a page before it starts to really affect the load time of the page. Just to make things a little clearer, and please remeber I am pulling this from memory, sbScript contains the JS for positioning the popup. sbOpen contains the XML for the opening animation. I did not include the closing since it is a little redundant.

1Protected Sub Page_PreRender(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles Me.PreRender2Dim _aeOpenAs New AjaxControlToolkit.AnimationExtender3Dim sbOpenAs New StringBuilder4Dim sbScriptAs New StringBuilder5Dim _ibHelpAs New ImageButton67 sbScript.AppendLine("<script type=""text/javascript"" language=""javascript"">")8 sbScript.AppendLine(" function Cover(bottom, top, ignoreSize) {")9 sbScript.AppendLine(" var location = Sys.UI.DomElement.getLocation(bottom);")10 sbScript.AppendLine(" top.style.position ='absolute';")11 sbScript.AppendLine(" top.style.top = location.y +'px';")12 sbScript.AppendLine(" top.style.left = location.x +'px';")13 sbScript.AppendLine(" if (!ignoreSize) {")14 sbScript.AppendLine(" top.style.height = bottom.offsetHeight +'px';")15 sbScript.AppendLine(" top.style.width = bottom.offsetWidth +'px';")16 sbScript.AppendLine(" }")17 sbScript.AppendLine(" }")18 sbScript.AppendLine("</script>")19 Response.Write(sbScript.ToString)2021 _ibHelp.ID = "ibHelp"22 _ibHelp.OnClientClick = "return false;"23 _ibHelp.ImageUrl = "/admin/images/buttons/help.png"24 _ibHelp.ToolTip = "ClickFor Help"25 phAnimation.Controls.Add(_ibHelp)2627 sbOpen.Append("<OnLoad><OpacityAction AnimationTarget=""info")28 sbOpen.Append(Me.ID)29 sbOpen.AppendLine(""" Opacity=""0"" /></OnLoad>")3031 sbOpen.AppendLine("<OnClick>")32 sbOpen.AppendLine("<Sequence>")3334 sbOpen.Append("<ScriptAction Script=""Cover($get('")35 sbOpen.Append(_ibHelp.ClientID)36 sbOpen.Append("'), $get('flyout")37 sbOpen.Append(Me.ID)38 sbOpen.AppendLine("'));"" />")394041 sbOpen.Append("<StyleAction AnimationTarget=""flyout")42 sbOpen.Append(Me.ID)43 sbOpen.AppendLine(""" Attribute=""display"" Value=""block""/>")4445 sbOpen.Append("<Parallel AnimationTarget=""flyout")46 sbOpen.Append(Me.ID)47 sbOpen.AppendLine(""" Duration="".3"" Fps=""25"">")4849 sbOpen.AppendLine("<Move Horizontal=""150"" Vertical=""-50"" />")50 sbOpen.Append("<Resize Width300"" Height=""300"" />")5152'sbOpen.Append("<Color AnimationTarget=""flyout")53 'sbOpen.Append(Me.ID)54 'sbOpen.AppendLine(""" StartValue=""#AAAAAA"" EndValue=""#FFFFFF"" Property=""style"" PropertyKey=""backgroundColor"" />")55 'sbOpen.AppendLine("</Parallel>")5657 sbOpen.Append("<ScriptAction Script=""Cover($get('flyout")58 sbOpen.Append(Me.ID)59 sbOpen.Append("'), $get('info")60 sbOpen.Append(Me.ID)61 sbOpen.AppendLine("'), true);"" />")6263 sbOpen.Append("<StyleAction AnimationTarget=""info")64 sbOpen.Append(Me.ID)65 sbOpen.AppendLine(""" Attribute=""display"" Value=""block""/>")666768 sbOpen.Append("<FadeIn AnimationTarget=""info")69 sbOpen.Append(Me.ID)70 sbOpen.AppendLine(""" Duration="".2""/>")7172 sbOpen.Append("<StyleAction AnimationTarget=""flyout")73 sbOpen.Append(Me.ID)74 sbOpen.AppendLine(""" Attribute=""display"" Value=""none"" />")7576 sbOpen.Append("<StyleAction AnimationTarget=""info")77 sbOpen.Append(Me.ID)78 sbOpen.AppendLine(""" Attribute=""height"" Value=""auto""/>")7980 sbOpen.AppendLine("<Parallel Duration="".5"">")81 sbOpen.Append("<Color AnimationTarget=""info")82 sbOpen.Append(Me.ID)83 sbOpen.AppendLine(""" StartValue=""#666666"" EndValue=""#FF0000"" Property=""style"" PropertyKey=""color""/>")84 sbOpen.Append("<Color AnimationTarget=""info")85 sbOpen.Append(Me.ID)86 sbOpen.AppendLine(""" StartValue=""#666666"" EndValue=""#FF0000"" Property=""style"" PropertyKey=""borderColor""/>")87 sbOpen.AppendLine("</Parallel>")888990 sbOpen.AppendLine("<Parallel Duration="".5"">")91 sbOpen.Append("<Color AnimationTarget=""info")92 sbOpen.Append(Me.ID)93 sbOpen.AppendLine(""" StartValue=""#FF0000"" EndValue=""#666666"" Property=""style"" PropertyKey=""color""/>")94 sbOpen.Append("<Color AnimationTarget=""info")95 sbOpen.Append(Me.ID)96 sbOpen.AppendLine(""" StartValue=""#FF0000"" EndValue=""#666666"" Property=""style"" PropertyKey=""borderColor""/>")97 sbOpen.Append("<FadeIn AnimationTarget=""btnCloseParent")98 sbOpen.Append(Me.ID)99 sbOpen.AppendLine(""" MaximumOpacity="".9"" />")100 sbOpen.AppendLine("</Parallel>")101102 sbOpen.AppendLine("</Sequence>")103 sbOpen.AppendLine("</OnClick>")104105 _aeOpen.ID = "aeOpen"106 _aeOpen.TargetControlID = "ibHelp"107 _aeOpen.Animations = sbOpen.ToString108109 phAnimation.Controls.Add(_aeOpen)110End Sub

crLord, thanks for your reply.

here is what i have in my .ascx html code

ps: i want to put everything on the codebehind but not sure if that possible to do, can you please see my code and give your feedback?

thanks

here is my code:

<%@. Control Language="C#" AutoEventWireup="true" CodeFile="AJAXPopUp.ascx.cs" Inherits="usercontrols_AJAXPublicInfo" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %><div style="width: 200px"><!-- Button used to launch the animation--> <asp:ImageButton ID="btnInfo" runat="server" OnClientClick="return false;" ImageUrl="~/images/popup_info.gif" AlternateText="Show Detail Information..." /> <div id="flyout" style="display: none; overflow: hidden; z-index: 2; background-color: #ffff66; border: solid 1px #D0D0D0;"></div><!-- Info panel to be displayed as a flyout when the button is clicked --> <div id="info" style="display: none; z-index: 2; opacity: 0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); font-size: 12px; background-color: #ffffcc; padding: 5px; border-right: #999999 1px solid; border-top: #999999 1px solid; border-left: #999999 1px solid; border-bottom: #999999 1px solid;"> <div id="btnCloseParent" style="float: right; opacity: 0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);"> <asp:LinkButton ID="btnClose" runat="server" OnClientClick="return false;" Text="X" ToolTip="Close" Style="background-color: #666666; color: #FFFFFF; text-align: center; font-weight: bold; text-decoration: none; border: outset thin #FFFFFF; padding: 5px;" /> </div> <div style="width: 300px"><!-- BEGIN: Here you can place your content. --> <table id="tblPublicInfo" border="1" style="width: 320px; background-color: AntiqueWhite"> <tr> <td> <b> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> </b> </td> </tr> </table><!-- END: of the content. --> </div> </div> <script type="text/javascript" language="javascript"> // Move an element directly on top of another element (and optionally // make it the same size). // The location of the popup can be set in here. function Cover(bottom, top, ignoreSize) { var location = Sys.UI.DomElement.getLocation(bottom); top.style.position = 'absolute'; top.style.top = location.y + 'px'; top.style.left = location.x + 'px'; if (!ignoreSize) { top.style.height = bottom.offsetHeight + 'px'; top.style.width = bottom.offsetWidth + 'px'; } } </script> <ajaxToolkit:AnimationExtender ID="OpenAnimation" runat="server" TargetControlID="btnInfo"> <Animations> <OnClick> <Sequence> <%-- Disable the button so it can't be clicked again --%> <EnableAction Enabled="false" /> <%-- Position the wire frame on top of the button and show it --%> <ScriptAction Script="Cover($get('AJAXPopUp1_btnInfo'), $get('flyout'));" /> <StyleAction AnimationTarget="flyout" Attribute="display" Value="block"/> <%-- Move the wire frame from the button's bounds to the info panel's bounds --%> <Parallel AnimationTarget="flyout" Duration=".3" Fps="25"> <Move Horizontal="150" Vertical="-10" /> <Resize Width="300" /> <Color PropertyKey="backgroundColor" StartValue="#AAAAAA" EndValue="#FFFFFF" /> </Parallel> <%-- Move the info panel on top of the wire frame, fade it in, and hide the frame --%> <ScriptAction Script="Cover($get('flyout'), $get('info'), true);" /> <StyleAction AnimationTarget="info" Attribute="display" Value="block"/> <FadeIn AnimationTarget="info" Duration=".2"/> <StyleAction AnimationTarget="flyout" Attribute="display" Value="none"/> <StyleAction AnimationTarget="info" Attribute="filter" Value="progid:DXImageTransform.Microsoft.Shadow(direction=140,color=#666666,strength=4);"/> <%-- Flash the text/border red and fade in the "close" button --%> <Parallel AnimationTarget="info" Duration=".1"> <%-- PropertyKey="color" StartValue="#666666" EndValue="#FF0000" />--%> <Color PropertyKey="borderColor" StartValue="#666666" EndValue="#FF0000" /> </Parallel> <Parallel AnimationTarget="info" Duration=".1"> <%-- PropertyKey="color" StartValue="#FF0000" EndValue="#666666" />--%> <Color PropertyKey="borderColor" StartValue="#FF0000" EndValue="#666666" /> <FadeIn AnimationTarget="btnCloseParent" MaximumOpacity=".9" /> </Parallel> </Sequence> </OnClick> </Animations> </ajaxToolkit:AnimationExtender> <ajaxToolkit:AnimationExtender ID="CloseAnimation" runat="server" TargetControlID="btnClose"> <Animations> <OnClick> <Sequence AnimationTarget="info"> <%-- Shrink the info panel out of view --%> <StyleAction Attribute="overflow" Value="hidden"/> <Parallel Duration=".3" Fps="15"> <Scale ScaleFactor="0.05" Center="true" ScaleFont="true" FontUnit="px" /> <FadeOut /> </Parallel> <%-- Reset the sample so it can be played again --%> <StyleAction Attribute="display" Value="none"/> <StyleAction Attribute="width" Value="300px"/> <StyleAction Attribute="height" Value=""/> <StyleAction Attribute="fontSize" Value="12px"/> <OpacityAction AnimationTarget="btnCloseParent" Opacity="0" /> <%-- Enable the button so it can be played again --%> <EnableAction AnimationTarget="AJAXPopUp1_btnInfo" Enabled="true" /> </Sequence> </OnClick> <OnMouseOver> <Color Duration=".2" PropertyKey="color" StartValue="#FFFFFF" EndValue="#FF0000" /> </OnMouseOver> <OnMouseOut> <Color Duration=".2" PropertyKey="color" StartValue="#FF0000" EndValue="#FFFFFF" /> </OnMouseOut> </Animations> </ajaxToolkit:AnimationExtender> </div>

what isphAnimation?

My control was done in the code behind almost exclusively. I only had design elements in the .ascx. phAnimation is a PlaceHolder so I could add the controls. Here is my .ascx file. There are some things that were refernced for various reasons in my code behind like"lblHelpItemTitle" but I did include them in the above code for brevity. All they are, are controls tied to public properties of the control so I can assign their values based on what I wanted in that particular instance. Also the script code should only be added once to the page, but that should be fairly easy now with the new stuff for registering JS in 2.0. Response.Write is probably not the way to go anymore, but it sloved the problem then. I had orginally had a public property that was a boolean telling me if this was the first instance of the control on the page and if it was I included the script.

1<%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>23 <div>4 <div id="flyout<%=Me.ID%>" style="z-index:2;display: none; border: solid 1px #D0D0D0; background-color: #FFFFFF;overflow:hidden;"> </div>5 <div id="info<%=Me.ID%>" style="z-index:2;display: none; font-size: 12px; border: solid 1px #CCCCCC; background-color: #FFFFFF; width: 260px;">6 <div class="HelpItemTitleBar">7 <div class="HelpItemTitle">8 <asp:Label ID="lblHelpItemTitle" runat="server" />9 </div>10 <div class="HelpItemClose" id="btnCloseParent<%=Me.ID%>">11 <asp:LinkButton id="lbClose" runat="server" OnClientClick="return false;" Text="X" ToolTip="Close" />12 </div>13 </div>14 <div class="HelpItemText">15 <asp:Label ID="lblHelpText" runat="server" />16 </div>17 </div>18 </div>19 <asp:PlaceHolder id="phAnimation" runat="server" />

just to understand the code, i have implement your code in my test page and no errors found and why i run the page here is what i got:

Invalid Animation definition for TargetControlID="ibHelp": Name cannot begin with the '0' character, hexadecimal value 0x30. Line 1, position 82.

_aeOpen.Animations = sbOpen.ToString(); <<<<<<error

also i replace:
//Response.Write(sbScript.ToString);
this.Page.ClientScript.RegisterClientScriptBlock(GetType(),"OnClick", sbScript.ToString());

here is the complete code for your reference:

<%@.ControlLanguage="C#"AutoEventWireup="true"CodeFile="WebUserControl.ascx.cs"Inherits="usercontrols_WebUserControl" %><%@.RegisterAssembly="AjaxControlToolkit"Namespace="AjaxControlToolkit"TagPrefix="ajaxToolkit" %>

<div>

<divid="flyout<%=this.ID%>"style="z-index:2;display: none; border: solid 1px #D0D0D0; background-color: #FFFFFF;overflow:hidden;"></div>

<divid="info<%=this.ID%>"style="z-index:2;display: none; font-size: 12px; border: solid 1px #CCCCCC; background-color: #FFFFFF; width: 100px; height: 34px;">

<divclass="HelpItemTitleBar">

<divclass="HelpItemTitle">

<asp:LabelID="lblHelpItemTitle"runat="server"/>

</div>

<divclass="HelpItemClose"id="btnCloseParent<%=this.ID%>">

<asp:LinkButtonid="lbClose"runat="server"OnClientClick="return false;"Text="X"ToolTip="Close"/>

</div>

<divclass="HelpItemText">

<asp:LabelID="lblHelpText"runat="server"/>

</div>

<asp:PlaceHolderid="phAnimation"runat="server"/>

code behind:

using System;using System.Data;using System.Configuration;using System.Collections;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;using System.Text;public partialclass usercontrols_WebUserControl : System.Web.UI.UserControl{protected override void Render(HtmlTextWriter writer) { AjaxControlToolkit.AnimationExtender _aeOpen =new AjaxControlToolkit.AnimationExtender(); StringBuilder sbOpen =new StringBuilder(); StringBuilder sbScript =new StringBuilder(); ImageButton _ibHelp =new ImageButton(); sbScript.AppendLine("<script type='text/javascript' language='javascript'>"); sbScript.AppendLine(" function Cover(bottom, top, ignoreSize) {"); sbScript.AppendLine(" var location = Sys.UI.DomElement.getLocation(bottom);"); sbScript.AppendLine(" top.style.position = 'absolute';"); sbScript.AppendLine(" top.style.top = location.y + 'px';"); sbScript.AppendLine(" top.style.left = location.x + 'px';"); sbScript.AppendLine(" if (!ignoreSize) {"); sbScript.AppendLine(" top.style.height = bottom.offsetHeight + 'px';"); sbScript.AppendLine(" top.style.width = bottom.offsetWidth + 'px';"); sbScript.AppendLine(" }"); sbScript.AppendLine(" }"); sbScript.AppendLine("</script>");//Response.Write(sbScript.ToString);this.Page.ClientScript.RegisterClientScriptBlock(GetType(),"OnClick", sbScript.ToString()); _ibHelp.ID ="ibHelp"; _ibHelp.OnClientClick ="return false;"; _ibHelp.ImageUrl ="/admin/images/buttons/help.png"; _ibHelp.ToolTip ="Click For Help"; phAnimation.Controls.Add(_ibHelp); sbOpen.Append("<OnLoad><OpacityAction AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" Opacity='0' /></OnLoad>"); sbOpen.AppendLine("<OnClick>"); sbOpen.AppendLine("<Sequence>"); sbOpen.Append("<ScriptAction Script='Cover($get('"); sbOpen.Append(_ibHelp.ClientID); sbOpen.Append("'), $get('flyout"); sbOpen.Append(this.ID); sbOpen.AppendLine("'));' />"); sbOpen.Append("<StyleAction AnimationTarget='flyout"); sbOpen.Append(this.ID); sbOpen.AppendLine(" Attribute='display' Value='block'/>;"); sbOpen.Append("<Parallel AnimationTarget='flyout"); sbOpen.Append(this.ID); sbOpen.AppendLine(" Duration='.3' Fps='25'>"); sbOpen.AppendLine("<Move Horizontal='150' Vertical='-50' />"); sbOpen.Append("<Resize Width300' Height='300' />");//'sbOpen.Append("<Color AnimationTarget='flyout") //'sbOpen.Append(Me.ID) //'sbOpen.AppendLine('" StartValue='#AAAAAA' EndValue='#FFFFFF' Property='style' PropertyKey='backgroundColor' />") //'sbOpen.AppendLine("</Parallel>") sbOpen.Append("<ScriptAction Script='Cover($get('flyout"); sbOpen.Append(this.ID); sbOpen.Append("'), $get('info"); sbOpen.Append(this.ID); sbOpen.AppendLine("'), true);' />"); sbOpen.Append("<StyleAction AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" Attribute='display' Value='block'/>"); sbOpen.Append("<FadeIn AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" Duration='.2'/>"); sbOpen.Append("<StyleAction AnimationTarget='flyout"); sbOpen.Append(this.ID); sbOpen.AppendLine(" Attribute='display' Value='none' />"); sbOpen.Append("<StyleAction AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" Attribute='height' Value='auto'/>"); sbOpen.AppendLine("<Parallel Duration='.5'>"); sbOpen.Append("<Color AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" StartValue='#666666' EndValue='#FF0000' Property='style' PropertyKey='color'/>"); sbOpen.Append("<Color AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" StartValue='#666666' EndValue='#FF0000' Property='style' PropertyKey='borderColor'/>"); sbOpen.AppendLine("</Parallel>"); sbOpen.AppendLine("<Parallel Duration='.5'>"); sbOpen.Append("<Color AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" StartValue='#FF0000' EndValue='#666666' Property='style' PropertyKey='color'/>"); sbOpen.Append("<Color AnimationTarget='info"); sbOpen.Append(this.ID); sbOpen.AppendLine(" StartValue='#FF0000' EndValue='#666666' Property='style' PropertyKey='borderColor'/>"); sbOpen.Append("<FadeIn AnimationTarget='btnCloseParent"); sbOpen.Append(this.ID); sbOpen.AppendLine(" MaximumOpacity='.9' />"); sbOpen.AppendLine("</Parallel>"); sbOpen.AppendLine("</Sequence>"); sbOpen.AppendLine("</OnClick>"); _aeOpen.ID ="aeOpen"; _aeOpen.TargetControlID ="ibHelp"; _aeOpen.Animations = sbOpen.ToString(); phAnimation.Controls.Add(_aeOpen); }}

Simple mistake. When you did the conversion you did not carry over the closing quote of some of the fields. For Example you have:

sbOpen.Append("<OnLoad><OpacityAction AnimationTarget='info");
sbOpen.Append(this.ID);
sbOpen.AppendLine(" Opacity='0' /></OnLoad>");

And It Should Be:

sbOpen.Append("<OnLoad><OpacityAction AnimationTarget='info");
sbOpen.Append(this.ID);
sbOpen.AppendLine("' Opacity='0' /></OnLoad>");

It is hard to see, but I added a closing quote before Opacity.

One more thing. If you plan to use more than one of these on any given page you will want to wrap the RegisterClientScript inside a conditional checking IsClientScriptRegistered.

thank you so much

one last question.

i'm planning to use the same usercontrol more then one in page

you mean this code should be wrap? like this?

if(!Page.IsClientScriptRegistered("myscript"))
{
sbScript.AppendLine("<script type='text/javascript' language='javascript'>");
sbScript.AppendLine(" function Cover(bottom, top, ignoreSize) {");
sbScript.AppendLine(" var location = Sys.UI.DomElement.getLocation(bottom);");
sbScript.AppendLine(" top.style.position = 'absolute';");
sbScript.AppendLine(" top.style.top = location.y + 'px';");
sbScript.AppendLine(" top.style.left = location.x + 'px';");
sbScript.AppendLine(" if (!ignoreSize) {");
sbScript.AppendLine(" top.style.height = bottom.offsetHeight + 'px';");
sbScript.AppendLine(" top.style.width = bottom.offsetWidth + 'px';");
sbScript.AppendLine(" }");
sbScript.AppendLine(" }");
sbScript.AppendLine("</script>");
//Response.Write(sbScript.ToString);
this.Page.ClientScript.RegisterClientScriptBlock(GetType(),"myscript", sbScript.ToString());

}

Yes. Otherwise you will get an error. Also I do not know if the AJAX toolkit has been improved in the latest version, but when I was using it it seemed that it added the animation scripts for each instance and after about 20 or so of these controls on a page the load time really slowed down. I would be interested to here how you fair if you do many on one page.

speed to me looks like good, i did not put any stuffs in it. may be.

but after implementingIsClientScriptRegistered i'm still getting the same data of a previous a previous and its not throwing me any error.

any idea?

i change the above code to something like this but still same problem:

if (!this.Page.ClientScript.IsClientScriptBlockRegistered("rb-popup"))
{
this.Page.ClientScript.RegisterClientScriptBlock("rb-popup","js/JScript.js"
}

I don't understand the problem. Are you saying you have multiple controls but with the same data over and over? If so post the control code and the code for the page calling and I will see if I can find the problem.

Monday, March 26, 2012

Progress Monitor Framework

In the August 2007 edition of Cutting Edge, Dino Esposito created an Ajax progress bar class. Sounded interesting so I downloaded the code, but I'm getting the following odd error on everypage and don't know how to resolve it:

"The 'webServices' start tag on line 67 does not match the end tag of 'scripting'.

I've rechecked that Ajax is properly configured.

Anyone have any ideas?

"The 'webServices' start tag on line 67 does not match the end tag of 'scripting'.

It seems a coding mistake.

Would you please provide us with any code?

Thanks

HiAlexB1318,

i had the exact same problem and this is due to an code error. I found the corrected code here:http://download.microsoft.com/download/f/2/7/f279e71e-efb0-4155-873d-5554a0608523/MSDNMag2007_08.exe

Progressbar code or tutorial when request is processing

Hi,

Any one have code or tutorial for progress or interval between submission or selection of any code.

like when I select data from grid than I dont postback and using updatepanel. So users dont see whats going on as no page refresh etc. So I want to show something that make them feel that there request is in process.

Thanks

Stay tuned... we'll have something for you soon!

I will be waiting the same thing ;)

Project Files For ASP .NET 2.0 AJAX Extensions 1.0

Hi,

I have downloaded the ASP .NET 2.0 AJAX Extensions 1.0 SOURCE CODE. From here (after following a link on the ajax.asp.net page)

http://www.microsoft.com/downloads/details.aspx?FamilyId=EF2C1ACC-051A-4FE6-AD72-F3BED8623B43&displaylang=en

NOW, when I install this msi file, the code is there, but there are NO PROJECT FILES!!!

I have tried creating two projects and putting the code into them, but then I get a whole bunch of errors saying that I am missing namespaces etc. I have tried to put all of the namespaces in, but my attempts have been futile (and I am not an idiot).

Can someone please point me to the place where I can get the project files or tell me what reference I need to include?

Btw. If you don't know the answer or you can only help me a little I don't want to hear from you.

Merci Buckets

Paul

paulasitechinc:
Btw. If you don't know the answer or you can only help me a little I don't want to hear from you.

First, with this you deserve no answers to your post!

Second, here, you post questions about AJAX Control Toolkit, not AJAX Extension!

Third:

"The ASP.NET AJAX Extensions Source Code release installs the source code and debugging symbols for
ASP.NET AJAX Extensions for use in maintaining and debugging your applications."

by Release Notes for ASP.NET AJAX Extensions Source Code

This is not a project for you to change and build and extend... You could do that, but you are at your own...

Property animation in javascript.

How do i perform a property animation in javascript? the code below does not do anything... anything wrong?

offSet = 40;
controlSize = 19;
animation = new AjaxControlToolkit.Animation.PropertyAnimation(
panel,
0.25,
100,
'style',
'height');
animation.setValue(offSet + numOfControls*controlSize + "px");
animation.play();

Hi ,

Try setting the Width Property to "null" in the ReSize animation .

Ex :

//AjaxControlToolkit.Animation.ResizeAnimation.play(target, duration, fps, width, height, unit);

AjaxControlToolkit.Animation.ResizeAnimation.play( $get("ID") , 0.3 , 125 ,null , 500 ,"px" );

Hope this helps

HI,

I am assuming that resolved it .

Feel free to correct me .

Hey,

Another way to increase only the height .

AjaxControlToolkit.Animation.LengthAnimation.play(panel, 0.25, 50 ,

'style' ,'height', 100 , 400 ,'px');

This is better than the Resize animation with the width set to null.

Saturday, March 24, 2012

Pure Ajax alternative for this atlas code

I want's to find out what will be the pure ajax that is client side script to get autocomplete functionality

that is for this atlas code
<form id="form1" runat="server">
<atlas:ScriptManager ID="ScriptManager1" runat="server" />
<div>
Enter a Name:
<asp:TextBox ID="txtName" runat="server" />
<atlas:AutoCompleteExtender ID="au" runat="server">
<atlas:AutoCompleteProperties Enabled="true" MinimumPrefixLength="1"
ServiceMethod="GetNames" ServicePath="MyNameService.asmx" TargetControlID="txtName" />
</atlas:AutoCompleteExtender>
</div>
</form>
where web service is

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class MyNameService : System.Web.Services.WebService {

public MyNameService () {

//Uncomment the following line if using designed components
//InitializeComponent();
}

[WebMethod]
public string[] GetNames(string prefixText, int count)
{
ArrayList filterList = new ArrayList();
string[] names = { "AzamSharp", "Scott", "Simon", "Alan", "Michael", "Jane", "Janice" };

foreach (string str in names)
{
if (str.ToLower().StartsWith(prefixText.ToLower()))
{
filterList.Add(str);
}
}

return (string[]) filterList.ToArray(typeof(string));

}

[WebMethod]
public string HelloWorld() {
return "Hello World";
}

}

Hi,

can you tell us why you don't want to use Atlas? Is it because you're developing with ASP.NET 1.x? If so you can take a look at Ajax.NET.

Grz, Kris.

the example here does something along along the lines of what your looking for

http://www.ajaxprojects.com/ajax/tutorialdetails.php?itemid=12

Mr X!!!
My Only Problem is lack of browsers support by atlas Like opera other it is the best and easiest of all ajax based technologies.
Mr X!!!
My Only Problem is lack of browsers support by atlas Like operaotherwise it is the best and easiest of all ajax based technologies.

hello.

though i haven't done it, i beleiver that you can try to adapt atlas to opera by writting a compat layer for it...i also don't know if one is needed...

Opera support is possible but it is currently a problem because of browser detection. A big issue is the lack of defineGetter and defineSetter mechanism. There would simply be no way to define custom DOM properties, in other words Atlas cannot have a compatability layer based on IE but would have to have use W3C DOM and create a compatability layer for IE.

There is really a lot of merit to this. Has the team considered this at all? I realize the IE dom was chosen as the base for reason of convenience (and I have read why) but there seems to be a few very good reasons to base it on W3C.

Not only would a W3C based Atlas that provides compatability layers for all browsers be The Right Thing but I think it can greatly help Atlas adoption throughout the whole web development community, not only the ASP/.NET/Windows/... community. I have already seen flame wars start because of this. There are tons more reasons I can think of why the W3C model for Atlas would be great.

The only reason I can think of for supporting the IE DOM model is to attract those more familiar with the model (ME!!!!).

Opera is an interesting browser with many oddities and a tiny market share (last I checked less than 2 percent) and I am sure before a full version of Atlas is released Atlas will support Opera. I personally do not worry about Opera too much, I am more interested in full Safari support.

REQEST: The Safari compatability layer can really use a unified solution for loading dynamic scripts. I currently have to use callbacks within the dynamically loaded script to know it is available... no onload or readystatechange... not cool. An iframe solution seems possible but I have not tried this yet. Another solution is to use a webrequest and eval but also have not tried this yet.

hum...man, i really love opera! btw, have you noticed that it has passed the acid test (version 9 beta)?

Luis - yeah I think Opera has the right idea make all their browsers (mobile, device and pc) run the same way. I've been playing with Opera 9 beta and its looking pretty good so far. I really think they need to rethink Opera and make it less complex for the novice users. I can see why a developer has an option to identify as Mozilla but a regular user? I personally wouldn't recommend Opera to my mom/dad...

hello again.

well, sorry, this is a biased opinion :) i recommend opera to everyone!

Purpose of Bridging

Ok, I have the Atlas CTP, and I must say, this beats trying to just code AJAX straight up. I have gotten the hang of using the Atlas controls and can get them to do what I want on the pages I want them to perform. And if anyone on the Atlas team reads this, kudos to you guys for sharing this!

Now I have been reading somethings on Bridge files, and the .asbx extension and what not. I even read and followed thehttp://atlas.asp.net/docs/Walkthroughs/DevScenarios/bridge.aspx Mash-Up tutorial and got the application to compile and run. But still have yet to read something that says using a Bridge is good for (insert action here).

From looking at the example, it appears that it is a way to create classes that can be called from the javascript, and thus query webservices directly from the JavaScript. Is that correct, or did I miss interpret along the way?

Thanks!

I think you understand it exactly. Specifically, bridging is good when the webservice you want to call isn't on your server. Calling a webservice on another server is problematic given that modern browsers limit cross-site scripting for security reasons.

In this case, a common solution is to build a server-side proxy to make the call for you. Bridging automates much of the work involved in doing that. It also gives you an easy way to define data transformations on the results of that webservice call.

I hope that helps, and I'm glad to hear you enjoy the product!

Steve,
Thanks for the response. All of the webservices my site consumes are located on our servers and with in our domain. I guess I've never tried to consume something from another domain. Thanks for the help in the clarification, and for now, I think I'll leave bridging be, and focus more on how I can make the rest of Atlas work for me.

Thanks again!

Put the UpdateProgress into an AlwaysVisibleControl?

I already have an updateProgress in a master page as per below code..

Is it possible to somehow wrap this in another control and have this control referenced by an AlwaysVisibleControl. Therefore when a user needs to scroll down a page the update progress will always be visible.

Thanks

atlas:UpdateProgressid="loadingProgress"runat="server"><ProgressTemplate><divstyle="text-align: right;"id="loadingAnimation"><imgid="img9"src="images/indicator3.gif"title="Loading"alt=" Loading"border="0"><asp:LabelID="Label1"runat="server"Font-Names="verdana"Font-Size=8ForeColor=silverText="Working..."></asp:Label></div></ProgressTemplate></atlas:UpdateProgress>Hi niallhannon,

There shouldn't be any reason you can't do this to my knowledge... are you having a problem trying to?

Thanks,
Ted

You are right, it does work, I must have been doing something wrong.

Thanks for the reply.

Please share what you did. I'm trying to do the same!

Never mind. I figured it out myself. The AlwaysVisibleControlExtender needs to be inside the <ProgressTemplate> tags. For example:

<%@.RegisterAssembly="AtlasControlToolkit"Namespace="AtlasControlToolkit"TagPrefix="cc2" %>

<atlas:UpdateProgressID="ProgressIndicator"runat="server">
<ProgressTemplate>
<asp:Panelid="progressArea"runat="server">
<br/>Loading, please wait...
<asp:ImageID="LoadingImage"runat="server"ImageUrl="~/Images/spinner.gif"/>
</asp:Panel>
<cc2:AlwaysVisibleControlExtenderID="AlwaysVisible1"runat="server">
<cc2:AlwaysVisibleControlPropertiesTargetControlID="progressArea"/>
</cc2:AlwaysVisibleControlExtender>
</ProgressTemplate>
</atlas:UpdateProgress>

That works great then.

Hi Jason,

I hadto the same problem as you when I tried this last week, and ended up putting the AlwaysVisibleExtender in the ProgressTemplate.

However I found that every few updates on the same page (4 or 5?) would pop a javascript message box saying "Unspecified Error". Everything else seems to work ok.

I was wondering if you have the same problem?

~Brett

No, I've not seen any issues like that. I'm using the June CTP if that helps. I'll keep an eye on it though as its an app I'm actively developing at the moment.

Are you sure the javascript error is related to the location of the AlwaysVisibleControlExtender?

I'm Using April, perhaps it was fixed. The Javascript error was definately related to AlwaysVisibleControlExtender - once I removed that from my form the error message stops. Add it back = message returns

~Brett

Try using the June CTP. I believe there are no breaking changes (at least there wasn't for me!).

Also, could you post your AlwaysVisibleControlExtender markup? Unless its simple, maybe there's an issue within it. Just a thought.

I tried this with the June CTP and it seems it works fine.

~Brett

Question about the confirmationbuttonextender control in the ajax tool kit

Is it possible to add code to this control? I am creating a mock credit card app and am using some of the validation controls(required and regular expession). When the user clicks "buy" and the info is not entered I have a Validation Summary popup box that shows up indicating that the fields need to be filled out correctly. After clicking "OK", the confirmation box pops up asking the user "Are you sure you want to purchase this software?". How to do I change this so the confirmation popup shows up after the validation is correct?

Thanks

Hi ts2527,

Based on my understanding, I think your concern is:
1. If the input is invalid, ValidationSummary control will pop up a prompt window.
2. If the input is valid, pop up a confirm window to confirm if user really want to continue. If user click "no", nothing happen. Otherwise, do something on the server side.

By the way, pop up a confirm dialog after ValidationSummary alert window is useless (for client validation), because the page is invalid and the request will not send to the server.

Based on my test, I implement it by RegisterStartupScript instead of extending the confirmationbuttonextender control. I hope it is acceptable to you. Following is the demo code.

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function ConfirmBuy()
{
var result = confirm('Are you sure you want to purchase this software?');
if (result)
{
document.getElementById('Button2').click();
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="RequiredFieldValidator" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" ShowMessageBox="True" />
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TextBox ID="TextBox1" runat="server" Style="position: static"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Style="position: static" Text="Button" OnClick="Button1_Click" />
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Style="display:none" Text="" />
</ContentTemplate>
</asp:UpdatePanel>
<input id="Hidden1" type="hidden" runat="server" />
</form>
</body>
</html>

*********** codebehind file
protected void Button1_Click(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, this.GetType(), "StartUpScript", "ConfirmBuy()", true);
}

protected void Button2_Click(object sender, EventArgs e)
{
//do something here
}

Wednesday, March 21, 2012

Question regarding error code

I added a script to the scriptmanager that cancels a request (a button click) if there current outstanding async request. Below the questions is the javascript that is being used

Questions:
1. I got a random 12004 error as a message box. Its only happened once, and I am not sure how to track it as it was "an unknown error".

2. Is there a way to tell if the way to tell if the the button caused the postback currently being processed, and the control requesting one?

3. In the javascript (taken fromhttp://www.asp.net/AJAX/Documentation/Live/tutorials/CancelAsyncPostback.aspx) there is this symbol: !== what does this do?

Sys.Application.add_load(ApplicationLoadHandler)
function ApplicationLoadHandler(sender, args)
{
Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(CheckStatus);
}

function CheckStatus(sender, args)
{
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm.get_isInAsyncPostBack() & args.get_postBackElement().id == 'Button1')
{
args.set_cancel(true);
}

}

if(typeof(Sys) !== "undefined") Sys.Application.notifyScriptLoaded();

!== and === are strictly typed comparisons, instead of the dynamic typing that JavaScript normally uses. For example, 3 == "3" is true, but 3 === "3" is false.

For checking the sender against current request, I'd suggest making sure the button is disabled when a request is made instead. That way you don't even have to worry about getting the same control that you're processing for as a new request (which I assume is what you're trying to handle with the check).

The issue is that javascript such as: document.getElementById('Button1').click() can still fire even if the button is disabled.

Question...AJAX Code??

This code below is about AJAX. Where I need to put this code? .aspx?

I'm trying to put in .aspx...But become error..

<%

 Dim sql, conn, rs, x


response.expires=-1
sql="SELECT * FROM CUSTOMERS WHERE CUSTOMERID="
sql=sql & "'" & request.querystring("q") & "'"set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("/db/northwind.mdb"))
set rs = Server.CreateObject("ADODB.recordset")
rs.Open sql, conn
response.write("<table>")
do until rs.EOF
 for each x in rs.Fields
 response.write("<tr><td><b>" & x.name & "</b></td>")
 response.write("<td>" & x.value & "</td></tr>")
 next
 rs.MoveNext
loop
response.write("</table>")
%>

To be honest..I'm new generation about programming..So, help me please..

Hi,

I suggest you learn fromhttp://www.asp.net/ajax/.

Good luck!

Questions - ModalPopup sample code

Hello, I'm trying to replicate the functionality presented here specific to the ModalPopup control:

http://ajax.asp.net/ajaxtoolkit/ModalPopup/ModalPopup.aspx

I've created a C# Ajax-enabled website project, have added the ScriptManager, ModalPopup, Panel and various Button controls, but although I've bound the ModalPopup to the button I want to have it use to activate my modal Panel, and though the project builds successfully, it doesn't react in the same way as the sample.

Here's the code from my skin file:

1<%@dotnet.itags.org. Page Language="C#" trace="true" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
23<%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>45<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
6<html xmlns="http://www.w3.org/1999/xhtml">
7<head>
8 <title>Untitled Page</title>
9</head>
10<body>
1112 <form runat="server">
1314 <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"></asp:ScriptManager>
15
16 <asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px" Visible="False" >
17
18 <asp:Button ID="OkButton" runat="server" Text="OK"></asp:Button>
19 <asp:Button ID="CancelButton" runat="server" Text="Cancel"></asp:Button>
2021 </asp:Panel>
22
23 <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server"24 TargetControlID="btnAddServer"25 PopupControlID="Panel1"26 BackgroundCssClass="modalBackground"27 DropShadow="true"28 OkControlID="OkButton"29 OnOkScript="onOk()"30 CancelControlID="CancelButton" />
31
32 <br />
33 <center>
3435
36 <asp:Panel ID="PanelMain" runat="server" Height="25px" Width="125px" HorizontalAlign="Center">
37
38 <asp:Button ID="btnAddServer" runat="server" Text="Add" Width="33px" /></td>
39
40 </asp:Panel>
41
42 </form>
43
44</body>
45</html>
46

At this point, I'm guessing that the missing piece of the puzzle lies with the CSS stuff and/or the master page, as that I haven't brought over from the sample project utilizing ModalPopup. Can someone please help me pinpoint what I'm missing that is preventing this from working?

Thanks in advance for any help. Smile

I found a fix which appears to work, but I'm still too much of a newbie to understand why. If someone could please explain I'd appreciate it.

After adding this to the "httpHandlers" section of my site project's Web.config file, my ModalPopup works:

<addverb="GET"path="ScriptResource.axd"type="Microsoft.Web.Handlers.ScriptResourceHandler"validate="false"/>

Thanks to this blogger: http://www.thecodinghumanist.com. The error I was encountering in the Javascript console (Firefox) was "Sys not defined", and the above appears to have addressed that, enabling the popup to work... somehow. Smile

Wednesday, March 28, 2012

Programatically Create Tab Container and Tab Panels

Programatically Expand CollapsiblePanel (With Lastest ToolKit)

Programmatically adding a ConfirmButtonExtender

Programmatically adding hoverbehavior

Programmatically Create AnimationExtender

Monday, March 26, 2012

Progress Monitor Framework

Progressbar code or tutorial when request is processing

Project Files For ASP .NET 2.0 AJAX Extensions 1.0

Property animation in javascript.

Saturday, March 24, 2012

Pure Ajax alternative for this atlas code

Purpose of Bridging

Put the UpdateProgress into an AlwaysVisibleControl?

Question about the confirmationbuttonextender control in the ajax tool kit

Wednesday, March 21, 2012

Question regarding error code

Question...AJAX Code??

Questions - ModalPopup sample code

Rating Control

Blog Archive

About Me