Forums

As result of investigating this issue, I decided to add a new feature - dynamic content loading.
Here is how it will work:
1. The item will have a new property - "dynamicLoad" - Boolean, false by default.
2. The Accordion will have new property - "contentLoader". It can be Function or Object. If function, it will be invoked before item expanding. It should load the content of the item and pass it back to Accordion (via event).
If the value is Object, it should have the following properties:
- "method" - must be Function, responsible for loading item's content.
- "scope" - context in which to execute the function.
- params - arbitrary value, will be passed directly to the function.
3. Before item expanding, Accordion will check if the content should be loaded dynamically. If true, it will set temporary content (simple "Loading..." message) and it will invoke the provided custom function.
4. Once it finishes the loading, it must fire the following event - "contentLoadingFinished". As parameters, it should pass the item and its new content.

I am still testing this feature and it is not yet released, so this is the right moment to tell me what do you think about it.

Iliyan

Actually, dynamic content loading works fine when the value of "contentHeight" property is "fixed" or "stretch".
It is pretty clear why - in these cases Accordion just doesn't care about the content. The height of the wrapper (Widget's body) is known and that's why we can change the content in each moment. This change will not involve changes to the other items in Accordion and especially these with "contentHeight" set to "stretch".

The problems come when we are working with item(s), which "contentHeight" property is set to "auto".
Here is what is going on when the user clicks on the header of such an item:
1. The Accordion calculates the height of the item. If this item still doesn't have content, its height will be 0px. If it has content, the height might be calculated to 16px or 116px - it doesn't matter.
2. Accordion fires "beforeItemExpand" event.
[Right now the developer sends IO request in order to load the content from the server].
3. Accordion collapses all items, which must be collapsed (if any).
4. Accordion increases or decreases the height of all items, marked as "stretched".
5. Accordion expands our item. Please note that the new content is still being transferred.
[The request from the server completes and the developer sets the new content via "bodyContent" property].

In this case the whole procedure, described above was nothing, but waste of time, because the height of our item has changed and we must adjust not only its height, but also those of all expanded and "stretched" items.
Not to mention that the request may complete in the middle of the above procedure.

That makes the things a little bit complicated. One solution might be to lock the Accordion in such cases, but I am still thinking about it.

Iliyan

I'm using method of auto and it works fine...as long as it's wrapped in a <table><tr><td> data </td></tr></table>. All other methods cut the bottom off.

Locking is always an option, but let's try to do something else before:
I did a small modification in Accordion and committed it in a separate branch - dynamic_load. I also added an example how to load content dynamically when "contentHeight" property is set to "auto". You can see it here. Save it to your computer and try it. I tested it in FF 3.5.8, Opera and Google Chrome.
As you see, we subscribe to "beforeItemExpand" and set a temporary "Loading..." message as content. Then we load the real content asynchronously. In this example we are doing this by using Y.later, but you can replace it with a IO request.
This is very close to what the user would expect from a real application.

So, please try to use this approach in your application. Do not forget to use the modified version of Accordion (see <script> and <link> tags in the example), and not those from Yahoo! CDN.
If this works, I will merge this change in the master branch.

Iliyan

Do you have an exact name for this sub-div or is it common among all the accordion item bodies?