update several textboxes from different services

I am trying to write my first application using atlas. what i want is to have 3 labels and one textbox. and one button.

the user enters a word into the textbox and clicks the button. what i then want to happen is for all 3 labels to be populated by calls to 3 separate webservices. sounds simple enough but..

these webservices may take some time to return, and i don't want to postback the entire page and then the user have to wait for each service to return before the page reloads.

What i want is for each label to be updated independently, so label1 migth be updated before 2 and 3
and 3 might be updated before 2. but at least the time the user has to wiat before something is returned is only as long as it takes for the first label to be updated.

i've read the following article on codeproject
http://www.codeproject.com/Ajax/HelloAtlas.asp

but this just deals with a partial postback to the same page, which isn't what i need to do.

If anyone can help or point me in the direction of an article that does something similar to what i would like to do, i'd appreciate it loads.

hello.

well, the scenario you describe can be easilly achieved by using the client portion of atlas. check this page:

http://atlas.asp.net/docs/atlas/doc/services/consuming.aspx#simple

Thanks for the reply. funnily enough i'd just started reading that tutorial.

I have made some progress. i enter a value in a texbox click a button. then 2 webservices are called asyncronously (ws1 sleeps for 5 seconds and returns a string ws sleeps for 2 seconds and returns a string) the results from these ws are then displayed in 2 textboxes.

However in order for the results to update these textboxes i've had to use standard html tags, not asp.net labels, i guess because they are generated server side.

What i would like to do is combine what i have so far with the display opf a progress animation like in this codeproject article.

http://www.codeproject.com/Ajax/HelloAtlas.asp

i think what i'm asking is how can i control an update panel and updateprogress cotnrol via javascript.

all i want it to be able to is whilst the webservice is being called, display a little .gif, and then when the webservice returns output the results within a dif

below is my code so far. any help would be appreciated

<atlas:ScriptManagerID="ScriptManager1"runat="server"EnablePartialRendering="true"><Services><atlas:ServiceReferencePath="WebService.asmx"/><atlas:ServiceReferencePath="WebService2.asmx"/></Services></atlas:ScriptManager><div></div><inputid="inputName"/><inputid="buttonGo"type="button"value="GO"onclick="return OnbuttonGo_click()"/><atlas:UpdatePanelID="wsOne"runat="server"><ContentTemplate><inputid="Label1"type="text"/>

<inputid="Label2"type="text"/>

</ContentTemplate>

</atlas:UpdatePanel>function OnbuttonGo_click()

{

//Oh yes. method one gets called first but 2 returns first oh yes as ws one sleeps for 5 secs and ws2 only sleeps for 2.//now need to look at batching//and also need to look at how to update sections of the html page with the results.//can i use updatepanels?

requestSimpleService = WebService.testAsync(

document.getElementById(

'inputName').value,//params

OnCompleteOne,

//Complete event

OnTimeout

//Timeout event

);

//Call script proxy passing the input element data

requestSimpleService = WebService2.testAsync(

document.getElementById(

'inputName').value,//params

OnCompleteTwo,

//Complete event

OnTimeout

//Timeout event

);

returnfalse;

}

function OnCompleteOne(result)

{

document.getElementById(

'Label1').value = result;

}

function OnCompleteTwo(result)

{

document.getElementById(

'Label2').value = result;

}

function OnTimeout(result)

{

alert(

"Timed out");

}

Ok, made a bit more progress. i can now output my results to separate divs.

All i need to be able to do now is to display a .gif in each div until the function returns.

function OnCompleteOne(result)

{

document.getElementById(

'wsone').innerHTML = result;

}

function OnCompleteTwo(result)

{

document.getElementById(

'wstwo').innerHTML = result;

}

<atlas:UpdatePanelID="wsOnePanel"runat="server"><ContentTemplate><divid="wsone"></div><divid="wstwo"></div></ContentTemplate></atlas:UpdatePanel>

hello.

first, you don't need to use an updatepanel in this scenario. the updatepanel let's you refresh a portion of the page but it should only be used when you're transforming an aspx page into an atlas page. second, you can do what you want easilly: to do that, you just need to show the icon during the start method and hide it during the end method.

aha well i've got it working. basically after each webservice call i set the inner html of the divs to the animated gif.

Then on completion the oncomplete function is called, which overwrites the innerhtml with the result.

requestSimpleService = WebService.testAsync(

document.getElementById(

'inputName').value,//params

OnCompleteOne,

//Complete event

OnTimeoutOne

//Timeout event

);

//display .gif

document.getElementById(

'wsone').innerHTML ='<img src=blue_forward.gif />'//Call script proxy passing the input element data

requestSimpleService = WebService2.testAsync(

document.getElementById(

'inputName').value,//params

OnCompleteTwo,

//Complete event

OnTimeoutTwo

//Timeout event

);

//display .gif

document.getElementById(

'wstwo').innerHTML ='<img src=blue_forward.gif />'