Search jQuery

jQuery Forum

Add content dynamically to collapsible??

in jQuery Mobile • 11 years ago

Hi all,

I'm trying to add some content dynamically to a collapsible in my html page but its just not happening! Can someone tell me how I could proceed?? Following is the code I am using right now

HTML

<div data-role="collapsible" id="campaignObjectives" data-theme="a">
<h3>Objectives</h3>
</div>
<div data-role="collapsible" id="campaignDescription">
<h3>Description</h3>
</div>

$('#campaignObjectives').append('<p>'+results.rows.item(j).Objectives+'</p>');

I thought along the lines of how content is dynamically added to a list view hence used the append method with the collapsible element but this just displays the content below my collapsible and not within the collapsible.

I referred this link but the solution given in the end didn't make sense to me and trials proved futile. Could somebody please give me some pointers on how I could handle this?? Any help would be greatly appreciated.

Thanks!

Replies(8)

haga0054

Re: Add content dynamically to collapsible??

11 years ago

Simply add .trigger("create") at the end of your javascript. See this fiddle example I created for you.

http://jsfiddle.net/rzdhJ/

I removed the dynamic text and replaced it with some static text to show. Every time you click the button new content will be loaded.

ares05

Re: Add content dynamically to collapsible??

11 years ago

Thanks for the reply!

I tried the fiddle example on my browser (Mozilla) but it doesn't work. The text "Added New Text" is placed below the Objectives collapsible, it is not added inside the collapsible. I want to add the text dynamically within the collapsible.