Going For AJAX: control

Showing posts with label control. Show all posts

Wednesday, March 28, 2012

How do I use external scripts in controls, with brittle-old-atlas?

Hi, I realise Atlas is still in preview, but unfortunately it doesnt stop customer's demands :(

I've a server control that will not work with Atlas. I've whittled the problem down to this external script line.

Here's the kicker, the embedded script referred to above is just a small JS file with everything commented out.

If I don't register the script, the page works, if I do register thescript, then my simple little page with an UpdatePanel fails to updatewhen a postback happens. Please refer to my earlier post on thesame problem for the actual aspx pagehttp://forums.asp.net/thread/1318847.aspx

The script line above appears in the rendered code in the correct place

Any and all help gratefully received, thanks!

JimHas nobody else experienced this?

I've reproduced it with a simple control that does nothing more than register an embedded script (which is empty).

Thanks
Jim
Turns out it works OK in Firefox, just not in IE6. Kind of ironic.

Please somebody, put me out of my misery!

Jim

Nevermind, I've had to work around it, looks like a bug in Atlas :(

HOW DO I update a control from outside the updatepanel

i have an update panel with 4 panels. when the user select panel 2 i need a control outside the updatepanel to become visible. i can not put the hidden div inside the updatepanel because the contents of the div will not work. how do update the div control from panel 2?

To make visible the control outside updatepanel is not possible upto my knowledge. definitely you have to include that control into another udpatepanel or include it with your 1st updatepanel.

Hi CurlyFro,

Here is the sample to indicate how to show a hidden div, which is out of a UpdatePanel, from a panel click event or a button click event in UpdatePanel. Hope it helps.

<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void Page_Load(object sender, EventArgs e) { } protected void Button2_Click(object sender, EventArgs e) { ScriptManager.RegisterStartupScript(this, this.GetType(), "key", "showDiv();", true); }</script><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>Untitled Page</title> <script language="javascript"> function showDiv(){ document.all.myDiv1.style.display=''; //do something here to update the hidden div } </script></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate><%=DateTime.Now.ToString()%> <asp:Panel ID="Panel1" runat="server" Height="50px" Width="200px" onclick="showDiv()" BorderColor="AliceBlue" BorderWidth="1px"> <input id="Button1" type="button" value="button" /> </asp:Panel> <br/> <asp:Panel ID="Panel2" runat="server" Height="50px" Width="200px" BorderColor="Black" BorderWidth="1px" > <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="ServerSideButton" /> </asp:Panel> </ContentTemplate> </asp:UpdatePanel> <div id="myDiv1" style="width: 200px; height: 100px; display: none"> This is the hidden div </div> </form></body></html>

This sample contains two ways (server side and client side methods) to show the hidden div.

If i misunderstood you, please let me know!

i'm creating a registration form. panel1 is my license, panel2 is the registration form, panel3 is my confirmation. on panel2 i have form hints for specific textboxes. how do i get the form hints to be hidden then shown on panel2?

Since you have many steps, I suggesting to wrap these in an Asp.net Wizard Control then put the Wizard Control in an UpdatePanel.

Hi CurlyFro,

Would you please share your source code here ? It is not necessary that you send out the complete source of your project. We just need a simplest sample to reproduce the problem. You can remove any confidential information or business logic from it.

Hi CurlyFro,

Has your problem been resolved yet?

How do I trigger a script to run when a PopupControl gets hidden?

To put it another way: How do I trigger a script to run when a PopupControl gets hidden? Smile

Seeing as the control toolkit handles all the event trapping and so on, I don't know what event to trap and how. Anyone know?

Hi,

the ModalPopup exposes an OnCancelScript property. You can set this property to the script that will be executed when the popup is dismissed.

Hmm ... if I was using a ModalPopup that would be a great tip, but I'm using a normal PopupControl. I've found a dirty trick - the animation property allows a javascript routine to be called when the popup closes. Initially I tried using a javascript _doPostBack to run a server-side routine, but I couldn't get that to work, so I did the whole thing client side instead. It may not be the prettiest way to do it, but hey, it works.

HOW do I popup the model popup programmatically?

It's tried to a control click by default.
Does the model popup allow for programmatic viewing?

Thanks!

I really need this!

You can use a hidden button as the targetcontrolid of the modalpopup and have your button postback as normal. You can then call Show() from codebehind or show() from JS to show the modalpopup.

Someone posted this a while back. Another option would be to call the click method of the button you used for the targetcontrolid.

Show and Hide ModalPopupExtender from JavaScript

1) Assign a BehaviourID to the ModalPopupExtender using the BehaviourID attribute.

BehaviorID ="ModalBehaviour"
.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}

2) Use the $find method to get a handle to the Modal Popup Behaviour .

$find ("ModalBehaviour").
.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}

3) Call your hide and show methods on the acquired handle.

4) The Javascript would look like this.

<script language="javascript">function ShowModalPopup() { $find("ModalBehaviour").show(); }function HideModalPopup() { $find("ModalBehaviour").hide(); }</script>

Thanks.

I found what I needed:

ModalPopupExtender1.Show();

Hi ,

That would be me Big Smile .

Here is the link to the original Post.

http://blogs.msdn.com/phaniraj/archive/2007/02/20/show-and-hide-modalpopupextender-from-javascript.aspx

Hope this helps.

Hello,

I have a new problem.
How can I stop the modal popup from disappearing when a postback occurs.

For example, if I have a button on the modal "form", a click makes it dissappear.

Help!

Thanks!

The modal popup will disappear if the entire panel is wrapped in an updatepanel. You can move the update panel inside the panel tags or call Show() in server side code to keep it visible.

How do I play the animation on control B when hovering over control A?

Hello.

When I hover over a control (in my case a menu), and I want to play the animation on a panel instead my menu, how can I do that?

This is my code so far, I just can't figure out how to change from the menu to the panel.

<asp:scriptmanager ID="Scriptmanager1" runat="server" />
<asp:Menu ID="MyMenu" runat="server" .................................. /
<div class="AnimateThis" id="AnimateThis" runat="server">
This is the text I want to play the animation on.
</div
<ajaxToolkit:AnimationExtender ID="MyAnimation" runat="server" TargetControlID="MyMenu" BehaviorID="AnimateMyText">
<Animations>
<OnHoverOver>
<FadeOut/>
</OnHoverOver>
<OnHoverOut>
<FadeIn/>
</OnHoverOut>
</Animations>
</ajaxToolkit:AnimationExtender

Hi,

Take a look at the Animation Target section of theUsing Animations walkthrough.

Thanks,
Ted

It seems I should use AminationTarget to do this. Thanks.

How do I intsall the Atlas Control Toolkit?

Can someone please direct me on where I can find documentation or webpage on how to install the Atalas Control Toolkit?

hello.

well, you just download it and then add the dll to your bin's folder.

You can find it here:

http://ajax.asp.net/default.aspx?tabid=47&subtabid=477

Monday, March 26, 2012

How do I get the CalendarExtender to show Gridview Templete Field

i want to use Calendar Extender Control in My grid view's temple field how can i use that calendar control

Code (calendar extender is associated with End Date):

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="Employee Id,Start Date" DataSourceID="SqlDataSource1">
<Columns>
<asp:CommandField ShowEditButton="True" />
<asp:BoundField DataField="Employee Id" HeaderText="Employee Id" ReadOnly="True" SortExpression="Employee Id" />
<asp:TemplateField HeaderText="Start Date" SortExpression="Start Date">
<EditItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("[Start Date]") %>'></asp:Label>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("[Start Date]") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="End Date" SortExpression="End Date">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("[End Date]") %>'></asp:TextBox>
<cc1:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="Textbox1">
</cc1:CalendarExtender>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("[End Date]") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>

How do i get a ReorderList to render vertically

I need to render a ReorderList in a vertical direction instead of the standard horizontal way.

Does anybody know hoe to do this, so the control works like the RadioButtonList with a repeat direction property?

In HTML i know i can get <ul> and <ol> to render vertically using CSS, but i so far cannot duplicate this using a ReorderList.

Thanks in advance

yosh

Sorry got my directions mixed up, need list to render horizontally..

I added a line to the contructor of the BulletList class that sets the CssStyle to enable the list to render horizontally, but not an elegent way of doing things. The Bulletlist in the reorderlist class is not visible to child classes, so i will need to change the base class anyway.

Any better ideas?

How do I extend an Atlas extender?

Let's say I create my own Atlas Control Extender. For example, I create an extender called MyHoverExtender. But instead of extending Control or WebControl, I want to extend the HoverMenuExtender. But when I change it to use that, I get this error:

error BC32044: Type argument 'SearchResultItem.MyHoverExtenderProperties' does not inherit from or implement the constraint type 'Microsoft.AtlasControlExtender.TargetControlPropertiesBase(Of AtlasControlToolkit.HoverMenuExtender)'.

Can anyone help me with this error?

Thanks

The extender class and the properties class have to travel in pairs. So if you derive from the extender, you need to also do so from the properties class. I think if you just have your MyHoverExtenderProperties class inherit from HoverMenuProperties you should be OK.

So here's what I've got right now:

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

MyHoverExtenderDesigner.vb:

Class MyHoverExtenderDesigner
Inherits Microsoft.AtlasControlExtender.Design.ExtenderControlBaseDesigner(Of MyHoverExtenderProperties, AtlasControlToolkit.HoverMenuExtender)
End Class

Produces this error:

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

MyHoverExtenderExtender.vb:

<Assembly: System.Web.UI.WebResource("SearchResultItem.MyHoverExtenderBehavior.js", "text/javascript")>

<System.ComponentModel.Designer(GetType(MyHoverExtenderDesigner))> _
<Microsoft.AtlasControlExtender.ClientScriptResource("MyHoverExtender", "MyHoverExtenderBehavior", "SearchResultItem.MyHoverExtenderBehavior.js")> _
Public Class MyHoverExtenderExtender
Inherits Microsoft.AtlasControlExtender.ExtenderControlBase(Of MyHoverExtenderProperties, AtlasControlToolkit.HoverMenuExtender)
End Class

Produces this error:

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

MyHoverExtenderProperties.vb

<System.ComponentModel.DefaultProperty("MyProperty")> _
Public Class MyHoverExtenderProperties
Inherits Microsoft.AtlasControlExtender.TargetControlPropertiesBase(Of AtlasControlToolkit.HoverMenuProperties)

Public Property MyProperty() As String
Get
Return GetPropertyStringValue("MyProperty")
End Get
Set(ByVal value As String)
SetPropertyStringValue("MyProperty", value)
End Set
End Property

End Class

This file builds without any errors as far as I can tell.

Oh, sorry, just find my problem.

The MyHoverExtenderProperties class was declared thusly:

Public Class MyHoverExtenderProperties
Inherits Microsoft.AtlasControlExtender.TargetControlPropertiesBase(Of AtlasControlToolkit.HoverMenuProperties)

But it should be declared:

Public Class MyHoverExtenderProperties
Inherits Microsoft.AtlasControlExtender.TargetControlPropertiesBase(Of AtlasControlToolkit.HoverMenuExtender)

That's closer. Does that work?

I think you actually want:

public class MyHoverExtender inherits HoverMenuExtender

public class MyHoverExtenderProperties inherits HoverMenuProperties

What you have above says that you'll be extending controls of type HoverMenuExtender, which I don't think you want.

Yeah, I think you're right. I'm in the process of confusing myself today between wanting to extend my own custom control using a modified version of the hover extender. I think I've almost got my head around it all.

:) Okay if you want more help confusing yourself, just let us know and we'll be glad to lend a hand.

Seriously, our refresh should help with this - I'm concerned you may run into some issues getting the right scripts to load as is. I haven't tried what you're doing so do let us know.

How do I Display an Animated GIF when afile is uploaded?

I cant believe how difficult this is to do. I asusmed using an updatepanel and an updateprogress control would handle this easily. My code is below. However "FileUpload1.PostedFile.FileName" is

always set to null. Can anyone suggest how I can display a simple animated gif when Im uploading a file to the server. I dont want a progress bar just a simple animated gif to show that something is a happening. Thanks!

protected void Button3_Click(object sender, EventArgs e)
{
string File1 = FileUpload1.PostedFile.FileName;

}

ASP.NET code:

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>

<asp:Button ID="Button3" runat="server" Style="z-index: 113; left: 8px; position: absolute;
top: 108px" Text="Button" OnClick="Button3_Click" />
<asp:FileUpload ID="FileUpload1" runat="server" Style="z-index: 101; left: 74px;
position: absolute; top: 438px" />

</ContentTemplate>
</asp:UpdatePanel>

<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl="~/Graphics/CAFQW3B9.gif" Style="z-index: 100;
left: 76px; position: absolute; top: 488px" />

</ProgressTemplate>
</asp:UpdateProgress>

Hi,

there are several controls that don't work asynchronously by putting them in an UpdatePanel controls. FileUpload is one of them so you need to set the uploadbutton to be a postbacktrigger of the UpdatePanel so a normal synchronous postback will occur.

Grz, Kris.

Thanks Kris. Im new to this and Im not really sure what you mean by "postbacktrigger". Can you point me to a url or post a ccode snippet that can explain how to show my animated gif on file upload?

Hi,

rangers99:
Im new to this and Im not really sure what you mean by "postbacktrigger".

You can take a look at the example on this page:http://ajax.asp.net/docs/mref/T_System_Web_UI_PostBackTrigger.aspx.

Grz, Kris.

How do I Databind to a GridView inside an Accordion Pane

I am trying to DataBind the results of a query to a GridView Control inside an Accoridon Pane. I can get the data from the elements in the Accordion Pane but I don't know how to add or bind data to them. Here is my code

ASP Code

<atlasToolkit:Accordion ID="MyAccordion" runat="server" SelectedIndex="0"
HeaderCssClass="accordionHeader" ContentCssClass="accordionContent"
FadeTransitions="true" FramesPerSecond="40" TransitionDuration="250"
AutoSize="none" >
<atlasToolkit:AccordionPane ID="AccordionRest" runat="server" >
<Header>
<a href="http://links.10026.com/?link=" onclick="return false;" class="accordionLink">Restricted Items</a>
</Header>
<Content><h1>Restrict SKUs</h1>
<asp:Label ID="lRestricted" runat="server" Text="This Months Restricted SKUS"></asp:Label>
<asp:GridView ID="gvRestricted" runat="server"></asp:GridView> 
<asp:Button ID="bRestricted" runat="server" OnClick="bRest_Click1" Text="Button" />
</Content>
</atlasToolkit:AccordionPane>

< /atlasToolkit:Accordion>

C# code

protected void Page_Load(object sender, EventArgs e)
{
String invoice = Session["invoice"].ToString();
DataSet data = ws.fillMain(invoice); //webservice to returns a DataSet
GridView gvRest = (GridView)AccordionRest.ContentContainer.FindControl("gvRest"); //This how I would get GridView, but I doesn't work to add Data to a GridView
gvRest.DataSource = data.Tables[0];
gvRest.DataBind();
}

If anyone has run into this problem and has figured out how to do this please let me know, thank you

I would create and bind the gridview in codebehind...

<atlasToolkit:AccordionID="MyAccordion"runat="server"SelectedIndex="0"

HeaderCssClass="accordionHeader"ContentCssClass="accordionContent"

FadeTransitions="true"FramesPerSecond="40"TransitionDuration="250"AutoSize="None">

</atlasToolkit:Accordion>

code behind:

...

AccordianPane pane =newAccordionPane();

pane.HeaderContainer.Controls.Add(newLiteralControl("headerName"));

pane.ContentContainer.Controls.Add(GetGridView());

MyAccordion.Controls.Add(pane);

privateGridView GetGridView(){

GridView gridView =newGridView();

...

}

Thanks for the help that worked Perfect.

I was able to add and populate the GridView control on the Accordion Pane. But I ran into an new obsticle. I have added a CommandField column to my GridView, and I want to catch the event when my commandview is selected. But I don't know how to declare the OnSelectedIndexChange in the code behind, and i dont' know if I catching the event correctly. Any help would be greatly appreciated, I am fairly new to ASP and Atlas, so detailed explainations and code examples are greatley appreicated.

Here is my code.

protected void Page_Load(object sender, EventArgs e) {try { String invoice = Session["invoice"].ToString(); DataSet data = ws.fillCustomer(invoice); GridView gvRestricted = NewGridView();/*how do I add a Command Field Event so I can catch it*/ gvRestricted.DataSource = data.Tables[0]; gvRestricted.DataBind(); AccordionRest.ContentContainer.Controls.Add(gvRestricted); }catch { } }public GridView NewGridView() { CommandField delete =new CommandField(); delete.ShowDeleteButton =true; delete.DeleteText ="Clear"; GridView grid =new GridView(); grid.CssClass ="gridView"; grid.HeaderStyle.CssClass ="gridViewHeader"; grid.FooterStyle.CssClass ="gridViewFooter"; grid.AlternatingRowStyle.CssClass ="gridViewAlternate"; grid.PagerStyle.CssClass ="gridViewPager"; grid.RowStyle.CssClass ="gridViewRow"; grid.Columns.Add(delete);return grid; }void gvRest_DeleteIndexChanged(Object sender, EventArgs e) { GridView grid = (GridView)AccordionRest.ContentContainer.FindControl("gvRest"); GridViewRow row = grid.SelectedRow;/*This is where I need to hand the event of the command field being triggered*/ }

I found the solution

grid.SelectedIndexChanged += new EventHandler(grid_SelecetedIndexChanged);

void grid_SelectedIndexChanged(Object sender, EventsArgs e)
{

}

I created the grid in code behind and register the PAgeIndexChanging event, but when I click in a diferent Page number the event hadlr is not fired or is filtreded by the accordion control and I don't get to change the page. Besides the site does a Posta back, whichi is not correct, because the accordion is inside a UpdataPanel de Ajax.

I don't know how to solve this issue.

Thank in advance for you help.

Try doing this for each AccordionControl on your page in the Page_Load event (before doing anything else with the AccordionControls):

 Accordion1.FindControl("dummy");

The "dummy" name isn't important, it's just that calling the FindControl method works around the problem. The full details of the problem were posted athttp://couldbedone.blogspot.com/2007/07/what-wrong-with-accordion-control.html (thanks to Yuriy!)

How do I consume a JavaScript object on the main page in an ASCX control?

Hello,

I am using the ASP.Net AJAX client side libraries, and I want to be able to write Web User Controls (ASCX) that I dynamically load into my site. I want to be able to have a global object in my main page that is used by each ASCX control that is loaded into the page. As soon as the ASCX control is loaded, I want it run its script to call a method in the global object.

I am having a "timing problem" with my code. In order to use the ASP.Net AJAX libraries (like the "Type" object to register namespaces, etc.), I have placed the JavaScript on the main page in the "pageLoad" function.

Right now I am using the "setTimeout" function in my ASCX script to delay it a few seconds so I can be sure that the script in the main page has completely loaded before I make a call to the global object.

Is there any way that I can ensure that the script on the main page has loaded and stop using the "setTimeout" method in my ASCX script?

Here is the markup for my main page…

1<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="StartupScriptTest._Default" %>23<%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>45<%@dotnet.itags.org. Register src="WebUserControl1.ascx" tagname="WebUserControl1" tagprefix="uc1" %>67<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">89<html xmlns="http://www.w3.org/1999/xhtml" >10<head runat="server">11 <title>Untitled Page</title>12 <script type="text/javascript">1314 var x = null; // <- I want to access this in the ascx control after pageLoad is finished1516 function pageLoad()17 {18 Type.registerNamespace('MyNamespace');1920 MyNamespace.MyClass = function()21 {22 MyNamespace.MyClass.initializeBase(this);23 }2425 MyNamespace.MyClass.prototype =26 {27 sayHello : function(message)28 {29 alert(message);30 }31 }3233 MyNamespace.MyClass.registerClass("MyNamespace.MyClass");3435 x = new MyNamespace.MyClass();36 }3738</head>39<body>40 <form id="form1" runat="server">41 <div42"ToolkitScriptManager1" runat="server">43 </cc1:ToolkitScriptManager>44 </div>45 <uc1:WebUserControl1 ID="WebUserControl11" runat="server" />46 </form>47</body>48</html>49

…and here is the markup for my ASCX control…

1<%@dotnet.itags.org. Control Language="C#" AutoEventWireup="true" CodeBehind="WebUserControl1.ascx.cs" Inherits="StartupScriptTest.WebUserControl1" %>2<script type="text/javascript">34 setTimeout('x.sayHello("hello")', 1000); // <- Any way to not use 'setTimeout'?56<>  
Thank you for your help,
Dave

hello.

i'll just enumerate the things i think that are important:

1. do you need to define the class in the load event? I think that you can put it outside, in an external file and load it so that it's available at the begining of the page

2. are you wrapping any html control or behavior that exists on the page? if not, then i think that you can also insert your x = new class() at the begining of the class declaration.

Hi restating what Luis has said, you gotto implement something like this.,

Create a .js file consider sample.js.

Put this code inside

Type.registerNamespace('MyNamespace');

MyNamespace.MyClass = function() { MyNamespace.MyClass.initializeBase(this); } MyNamespace.MyClass.prototype = { sayHello : function(message) { alert(message); } } if ( typeof (Sys) !== 'undefined' ) Sys.Application.notifyScriptLoaded();

<asp:ScriptManager ID="ScriptManager1" runat="server" >
<Scripts>
<asp:ScriptReference Path="../../client_scripts/sample.js" />
</Scripts>
</asp:ScriptManager>

Then create the global variable inside your function. var x = new MyNamespace.MyClass();

Saturday, March 24, 2012

How do I "replace" the ACT controls in my application?

Hi,

I have an application I wrote with an older version of the Atlas Control Toolkit. I just downloaded the latest version, and installed it. I'm wondering if there is anything else I need to do to update the controls in my application to use the more recent versions. Thanks.

Aaron

Nope. Just make sure the DLLs are replaced and everything should be fine.

Thank you.

Aaron

There were a few breaking changes in the framework though:

http://ajax.asp.net/files/Migration_Guide.doc

http://ajax.asp.net/files/Migration_Guide_Beta_Beta2.doc

How comes I can not find the UpdateProgress control?

it reports unknown tag - Unknown server tag 'asp:updateprogress'.

I can not find it in the dll neither.

Any idea?

thanks

hello.

you can find it in the value-added bits (check the download section on the ajax.asp.net site)

Hi,

and you can find an examplehere.

thanks, it is the value-add ctp I need install.

but I havn't found any document on what I should do to install it. it looks like it installs itself the same place as the 1.0 beta. But I need copy the Microsoft.Web.Preview.dll to my bin folder to make it work.

Now, I am getting new error -Could not load file or assembly 'Microsoft.Web.Resources.ScriptLibrary.PreviewDragDrop.js' or one of its dependencies. The system cannot find the file specified.

could you point out where I can find the install document? where I did wrong?

thanks

How can we access a control outside the update panel with an control inside the update pan

Take a very simple example, i have a button inside the update panel along with other controls and i have a textbox on the page.What i want is that when i click the button inside the update panel,it should update the textbox which is present outside the update panel.How can i do this?

To my knowledge you cannot update any control outside of the update panel. If you want to update the control move it inside the update panel.

Do you want to modify the text box with server-side code? If so, put it in its own UpdatePanel. Set the UpdateMode on the panel to Conditional. Then you can either add the button in the other UpdatePanel as an AsyncPostBackTrigger to the new UpdatePanel or invoke the Update method on the new UpdatePanel in your button's Click event handler.

If you want to modify the text box on the client, you're going to have to write JavaScript.

Can you please tell me what javascript should i write for the sition i mentioned in the above example.

I am not getting the idea using javascript for a control inside the update panel.

Are you sure you need to write JavaScript? I gave you the steps to modify the text box using purely server-side code by using a second UpdatePanel control. I highly recommend you read theUpdatePanel tutorials and then re-read what I suggested. This path doesn't require JavaScript, but does require a round-trip to the server which is where your code will be executing.

If you do need to use JavaScript, you're going to need to handle the button's click event, modify the other control, and then prevent the default action for clicking the button from occurring (if necessary). This would all be done on the client so wouldn't require a round-trip to the server, but involves learning JavaScript and the DOM API (which you should want to learn as a web developer, anyways).

i have read it but still i feel i need javascript.Can u help me?

How can Rating Control triggers a event where i click the CurrentRating?

a Rating Control Question

when i clicked the star what was not CurrentRating, it triggered a Changed event,
but i clicked the CurrentRating star, nonthing happened.

now, i'm writting a project. it's needed to show a rating of a item, and allow users to rate it.
i encountered a trouble, user can't rate by the same rating

for example, the current rating is 3, a user wants to rate by 3, but no event been triggered, because Rating control only has Changed event.
if rating were not changed, no event occured.

how can i resolve the problem? write a new control class to extend Rating? or other easier methods?

hi, can someone help me ?

How can I utilize AjaxControlToolkit:CalendarExtender inside my Gridview during edit mode?

Hello guys,

I have a Gridview control that has StartDate, EndDate field columns. In edit mode, when I clicked the StartDate or EndDate textbox to change the date, I need the calendarExtender popup, so I can select any particular date.

I tried this code in my ASPX page code behind, but still didn't work. Here is the code snippet:

...
TextBox txtStartDate = (TextBox)row.FindControl("txtStartDate");
AjaxControlToolkit.CalendarExtender calExtender =new AjaxControlToolkit.CalendarExtender();
calExtender.Format ="MM/d/yyyy";
calExtender.CssClass ="ajax__calendar";
calExtender.TargetControlID ="txtStartDate";
calExtender.DataBind();

TextBox txtEndDate = (TextBox)row.FindControl("txtEndDate");
AjaxControlToolkit.CalendarExtender calExtender2 =new AjaxControlToolkit.CalendarExtender();
calExtender2.Format ="MM/d/yyyy";
calExtender2.CssClass ="ajax__calendar";
calExtender2.TargetControlID ="txtEndDate";
calExtender2.DataBind();
...

Is there any step procedures, source code, or reference example, etc. I can use to accomplish this task? I greatly appreciate for any help to solve this problem. Thanks.

Why not convert your bound column to a item template column and drop the CalendarExtender Control directly inside the GridView?

or just use something similar toGreg Benoit's resusable calendar solution

I use this all over my site and i only have 1 calendar extender in the entire app. You can easily attach the extender on-the-fly using his example

I'll try to implement it on my Gridview control. Thanks for your suggestion.

How can i use dataSource control, let it binding to page method but not web service

such as

it binding to a web service named MyService.asmx,How can i binding it to a page method?

thanks

A data source can only declaratively bind to a DataService.

To bind it to other data, you can obtain the data programmatically (e.g. from a page method), and set the data property of the data source to the returned data.

Alternatively, you could directly bind the content (e.g. the ListView control) directly to the data, without using the data source control.

Thanks,

how can i use AjaxControlToolkit.resources.dll to use ajax with arabic language?

Hello.

I'm using ajax control toolkit and I'm having some difficulties , the direction and the alignment of the text can't be changed.

and in arabic it is different from english.

So how can i use the AjaxControlToolkit.resources.dll to apply the arabic language?

thanks

Hi,

You may specify the culture for the application in web.config. In globalization section.

For instance:
<globalization culture="en-us"/>

And you can refer to following documentations for more information:

http://msdn2.microsoft.com/en-us/library/c6zyy3s9.aspx
http://msdn2.microsoft.com/en-us/library/hy4kkhe0(VS.71).aspx

Hope this helps.

How can i use AJAX Control Toolkit in legacy ASP?

Hello to all,

like many i am new to AJAX and i am willing to dig in because i need to modernize an existing web application with pages in both in ASP (80%) and ASP.NET (20%) pages. I know the straightforward answer should be migrate all your asp in asp.net but unfortunately it's not an option.

Basically, what i am trying to do is to display a dragable panel on top those existing pages. The panel should be able to display information about the page. The user could also add new content in this panel and save seamlessly with AJAX.

First of all, if i want to reuse the widget from the toolkit, how can load them in ASP pages ?

Also, i read you can use the Ajax client library in non ASP.net. What does it mean ? I've look at it and it does seem very friendly. Any help would be appreciated.

Lastly, is it possible to have widget load from ASP integrated with an ASP.NET back-end for server side processing?

Thanks in advance for helping me out. I really would like to use this technology.

Olivier.

Well i got a solution that worked perfect for me: I am using Dojo. It's much more flexible in non ASP world and the toolkit set much richer as of now.

Wednesday, March 28, 2012

How do I use external scripts in controls, with brittle-old-atlas?

HOW DO I update a control from outside the updatepanel

How do I trigger a script to run when a PopupControl gets hidden?

HOW do I popup the model popup programmatically?

Show and Hide ModalPopupExtender from JavaScript

How do I play the animation on control B when hovering over control A?

How do I intsall the Atlas Control Toolkit?

Monday, March 26, 2012

How do I get the CalendarExtender to show Gridview Templete Field

How do i get a ReorderList to render vertically

How do I extend an Atlas extender?

How do I Display an Animated GIF when afile is uploaded?

How do I Databind to a GridView inside an Accordion Pane

How do I consume a JavaScript object on the main page in an ASCX control?

Saturday, March 24, 2012

How do I "replace" the ACT controls in my application?

How comes I can not find the UpdateProgress control?

How can we access a control outside the update panel with an control inside the update pan

How can Rating Control triggers a event where i click the CurrentRating?

How can I utilize AjaxControlToolkit:CalendarExtender inside my Gridview during edit mode?

How can i use dataSource control, let it binding to page method but not web service

how can i use AjaxControlToolkit.resources.dll to use ajax with arabic language?

How can i use AJAX Control Toolkit in legacy ASP?

Going For AJAX

Blog Archive

About Me