使用Ajax方法(方法)

Using an update panel in ASP.NET and with the help of a good tutorial on ListView from Matt Berseth I accomplished the image below.

alt text http://www.balexandre.com/temp/StackOverflow_HowToStartUsingAJAX.png

The behavior is, when I click the BOLD names, the rows below that name with numbers are collapsed.

Getting the DATA:

This is a SDK WebService that I cannot change, and with it I get the bold names in one call and for each bold name the list of the numerable rows, in this example I had to call 4 times the Web Service

1 call to provide me with all bold names and then 1 call per bold name to get the secondary list.

My employer told me to not do this, but only get the secondary row when a user clicks in the bold name ...

What should I do now? I'm kind'a lost here. :(

I know "what to do" but not "how to do"

  • I created a new row in the HTML to be replaced using jQuery
  • in the listView_ItemDataBound method I change the javascript to have that Row ID in order to be easier to use the javascript function

But, how do I show a "loading" image in that particular Row and load the secondary list?

(I already have a big one that is used to show a wait message when retrieving the bold names list)

alt text http://www.balexandre.com/temp/SuperOffice_forum_loadingIndicator.png

Do I need to create a middle WebService of my own to request this data right?

BIG problem is that I need to check "On Submit" those checkboxes in the secondary rows as well :(

I'm completely lost here, can anyone show me the light please?

ASP.NET Ajax can can use UpdateProgress the to display an image or anything.

<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="updPanel1" DisplayAfter="0">
    <ProgressTemplate>
        <img alt="Please Wait" src="Images/processing.gif" />
    </ProgressTemplate>
</asp:UpdateProgress>

You can use javascript to move it to any area on a page by setting the position to absolute.

The best way to do this solution is to program the who page using post backs. Then put an Ajax UpdatePanel on the page.

The web services you can call on the click event on each of the row to populate the data. Put the data in a panel that is hidden. Use Jquery and a start up script to display it if want it to "slide" down.

The best advice I can give is don't worry yet about having a real slick UI. Get the page working, and get the data from the web service. Then after you have that done, work on getting the UI to look better.

This is like playing music, you can't write all the parts of a song at once. You start with a theme then you create the melody, the second and 3rd parts etc. . . .