Programmatic Animations

We've got a new app where we are using the Accordian control like the blade interface on XBOX Live and we're building the Accordian control, and adding an updatepanel and adding a UpdatePanelAnimationExtender all programatically from a XML config document. However, I'm not sure how I can add a FadeEffect (http://ajax.asp.net/ajaxtoolkit/Walkthrough/AnimationReference.aspx#FadeAnimation). Here's thw code snippet.

Sean

AjaxControlToolkit.

AccordionPane pane =new AjaxControlToolkit.AccordionPane();

pane.ID = node.Attributes[

"Id"].Value;Label lblHeader =newLabel();

lblHeader.Text = node.Attributes[

"Header"].Value;

pane.HeaderContainer.Controls.Add(lblHeader);

pane.HeaderCssClass = node.Attributes[

"HeaderCss"].Value;

pane.ContentCssClass = node.Attributes[

"ContentCss"].Value;

UpdatePanel updater =newUpdatePanel();

updater.ID =

"updater" + node.Attributes["Id"].Value;

updater.UpdateMode =

UpdatePanelUpdateMode.Conditional;

pane.ContentContainer.Controls.Add(updater);

ProphitAccordion.Panes.Add(pane);

//Since the updater panel is created programatically we'll create our animation for the//updater panels also. Sean

AjaxControlToolkit.

UpdatePanelAnimationExtender upAnima =new AjaxControlToolkit.UpdatePanelAnimationExtender();

upAnima.ID =

"upda" + node.Attributes["Id"].Value;

upAnima.TargetControlID = updater.ID;

AjaxControlToolkit.

Animation updaAnimation =new AjaxControlToolkit.Animation();

updaAnimation.Properties.Add(

"id", ("updaAnimation" + updater.ID));//The following line doesn't work

AjaxControlToolkit.

Animation.FadeEffect upAnFade =new AjaxControlToolkit.Animation.FadeEffect();Hi Sean,

Check outthis post for details on how to dynamically create animations on the server side.

Thanks,
Ted

I know I am a little late to teh party (story of my life), but the link about doesn't work anymore and I am in desperate need of creating animations server side. Different colours for different actions, dynamically created update panels etc. This is about the only subject I can't find any info on, except this one solitary post - and now that's dead.

Programmatically Scroll GridView Control

I have an AJAX enabled web form with several data-filled GridView controls. The users accessing this web app will navigate the site via touch-screen monitors (i.e.: no mouse). As a result, I need an easy way for them to scroll the GridViews when the data is not visible. I want them to click on a button, which will then accordingly scroll the grid up or down. I have tried all the various combinations of the suggestions that I could find:

GridView.Rows(20).RowState = DataControlRowState.Selected

and

GridView.Rows(20).Focus()

and

GridView.SelectedIndex = 20

and

'Set focus to a hidden button control (column)
GridView.SelectedRow.Cells(5).Focus()

If I could set focus to a particular row, I think it should scroll to show that row. This would be fine, but nothing seems to work. Anyone have any suggestions on how I could programatically scroll a GridView control?

Thanks!

Hi AxeRose,

Did you find any solution for this problem?

I have asimilar purpose and meantime I don't have no idea, how to do this.

No, I never found a solution. I ended up using Paging instead -- which works fine for my situation.

Good luck!

I do not know if this works (and probably only in IE or in everything but IE ) but there is a javascript function called scrollIntoView that you could try. Just a suggestion.

Seehttp://forums.asp.net/t/1162570.aspx

You can use the JavaScript function: scrollTo(...)

-Damien

<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();

prm.add_beginRequest(beginRequest);

function beginRequest()
{
prm._scrollPosition = null;
}
</script>

http://forums.asp.net/t/1156877.aspx

Programming model question for Atlas apps

Hi,

I am designing a new web application and hope to leverage Atlas to make a better user experience than a regular ASP.NET web app. One of my things I hoping to archive to is to eliminate the need to have multiple ASPX pages.

Here is a scenario:

The web page may contain a left navigation panel that contains three links:

1. Step 1
2. Step 2
3. Step 3

If I am to design a regular ASP.NET web app, I would make each of the links point to a separate ASPX page. Each of ASPX will share a common chrome such as header, top navigation panel and left navigation panel, but the main content area will be different. I would use a shared master page for them. The drawbacks of the traditional approach are:

1. Opening each link will cause screen flickers
2. There will be network delay from one step to another step that I can not reduce by preloading asynchronously.
3. Each step will add to the browser history that my designer does not like.

I am hoping that Atlas will allow me to collapse all these ASPX pages into a single ASPX page, but I could not find a good approach. Specifically, I didn't find UpdatePanel useful for my design.

I am very interested to hear suggestions on how to archive my design objective. Thanks in advance.

Wei Zhu

hello.

well, you can use atlas to do this, though i really think that eliminating the history may not be a good thing. for instance, when i go to a web site, i really enjoy using the next and back buttons...and regarding to the delay, i really don't think that a normal asp.net page that has been modified to use atlas will be quicker that a traditional page.

Hi Luis,

Can you tell me how to use Atlas to achive my objective?

Regarding whether it is wise to eliminating IE history, I guess some people like it and some people don't. I personally don't have a strong opinion on either. As for the network delay, my thought is that using Atlas, maybe I can preload the UI for the step 2 asyncroulsy while user is still on step 1. However, reducing delay is more of an extra bonus credit, not a requirement.

Wei Zhu,

A simple approach to accomplish what I have interpreted your requirements is this:

Your left navigation could be setup as LinkButton controls.

You could put all 3 "pages" of content into a MultiView control.

On the postback of each LinkButton control, you could dynamically show and initialize all controls on the corresponding "View" of the MultiView control.

Surround all of these controls with an UpdatePanel and the result should be a page that appears to work completely clientside using the Atlas framework.

Hope this helps.

Ryan

Thanks Ryan.

I have considered using MultiView inside an UpdatePanel, but I think it will run into the following problems.

1. If I use Validators in each view, then switch view will cause a postback and the validators on those views that haven't been viewed will raise errors and prevent the postbacks from even happening.

2. This approach does not appear to be scale well as the number of views increase.

OK, I may have found a solution. The solution basically is to create a ASCX user control for each view, then load each user control dynamically using Page.LoadControl() inside a UpdatePanel. I did a quick test and it seems to work, although I still need to try it more.

This solution still does not address how to preload next view. It feel like possible to me, but I don't know exactly how to do it yet.

Have you considered using a Wizard control inside an update panel?

publish ajax website

Hi,

I am beginner with Ajax and I have done an app using some update panels and triggers but before I upload the app to the server I wanted to know if I have to do something on the server so the app will run without any problem.

1. I am not using any ajax control, only updates panel.

2. Do have to configure something?

3. Can I just publish the site and then upload it?

Can any body explain me something about it or maybe give me an URL where i can found some info.

Thanks a lot.

Just install the asp.net ajax framework on you server then you're good to go.

Thanks for your answer.

But it is a remote server so I do not think I have permissions to install the ajax framework. Or I have to tell my provider that I want that framework?

Thanks again.

hmmm hosting provider? Ask them, ... to do install it ... if they don't then transfer somewhere else. .. i'm with GoDaddy, and they have it ... the price is cheap too. if you do go with GoDaddy, check around for promotion code. i have one ... let me know if you need it ... Cheer.

I just talked to my provider and they do not have the ajax framework and the person that I working for does not want to change the provider. I know, I had to ask this person about this before I started....... there′s no way to run an app which has ajax without the Ajax Framework? I am just using update panels and triggers and no ajax controls.

Thanks a lot.

You can try putting the DLLs in the bin folder like the old "Atlas", but then your folder has to have full permission. AND for sure your provider will not give it to you.

i did try putting all the DLLs in the bin folder on my hosting provider (godaddy) when they didn't have ajax install. the result was, it blows up on me. yellow page. 'sigh' ...

who is your provider?

my provider is 1&1......why do I need full permission to put some dll in my projects?

Look I have all the Data access and the business logic in different projects. That means that in the client side I use the dll from those projects.

Do I need also full permissions to use these dll's in my project?

Or do I have to upload those project to server too?

Tanks a lot.

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
}

Question on Panels

Hi,
I would like to achieve the look in my app like live.com and pageflakes.com. How can I have multiple panels side by side? Do I just place panels into one table? How do I get them side by side? Do I creat a table with multiple columns and rows and add panels into each sections? Please advice.

Thanks

View->Source and you'll see the HTML they use. Work through to see how it's done. Looks like they will have either a TABLE structure or DIV elements.
Got it! Thanks.

Question: Is Upgrading Atlas Versions Easy?

Hi there,

I'm just wondering how difficult it will be to upgrade an app using the October release to the January release of Atlas. Are there any issues I should be looking at? Has anyone else tried it?I've never done it, but I have upgraded one of Nikhil Kothari's samples from the PDC2005: thePhotoBrowser to the December release and there were several API changes. These files are dated in September 2005, so I'm assuming they're using an earlier release than the October release. I believe upgrading from the December to the January release should be a smoother process.