html5 - Materialize Collapsible Dont Open with Javascript -
i'm inserting collapsible html receives json , adds information it.
but collapsible not open, opens if insert same in html itself, can not leave have generate results json , create collapsibles each object.
javascript:
function generatepeoples__(objjson){ for(cat in objjson.categories){ document.getelementbyid('peoples-information').innerhtml += '<ul class="collapsible" data-collapsible="accordion">' + '<li>' + '<div class="collapsible-header"><i class="fa fa-id-card-o" aria-hidden="true"></i><strong>people ('+ cat +')</strong></div>' + '<div class="collapsible-body white">' + '<ul class="collection">' + '<li class="collection-item avatar">' + '<i class="fa fa-male circle blue" aria-hidden="true"></i>' + '<span class="title title-collection-content-information">type of categories</span>' + '<p><strong>'+ objjson.categories[cat].name +'</strong></p>' + '<a href="#!" class="secondary-content">' + '<span class="new black badge" data-badge-caption=" "><strong>+ objjson.categories[cat].score + '%' +</strong></span>' + '<span class="new black badge" data-badge-caption=" "><strong>score</strong></span>' + '</a>' + '</li>' + '</ul>' + '</div>' + '</li>' + '</ul>'; } };
html
<div id="peoples-information"></div>
working:
function generatecelebrities__(objjson){ for(cat in objjson.categories){ for(cel in objjson.categories[cat].detail.celebrities){ document.getelementbyid('celebrities-information').innerhtml += '<ul class="collapsible" data-collapsible="accordion">' + '<li>' + '<div class="collapsible-header"><i class="fa fa-id-card-o" aria-hidden="true"></i><strong>celebrity ('+ cap++ +')</strong></div>' + '<div class="collapsible-body white">' + '<ul class="collection">' + '<li class="collection-item avatar">' + '<i class="fa fa-star circle yellow-text mydiv" aria-hidden="true"></i>' + '<span class="title title-collection-content-information">celebrity name</span>' + '<p><strong>'+ objjson.categories[cat].detail.celebrities[cel].name +'</strong></p>' + '<a href="#!" class="secondary-content">' + '<span class="new black badge" data-badge-caption=" "><strong>'+ objjson.categories[cat].detail.celebrities[cel].confidence +" %" +'</strong></span>' + '<span class="new black badge" data-badge-caption=" "><strong>confidence</strong></span>' + '</a>' + '</li>' + '</ul>' + '</div>' + '</li>' + '</ul>'; } } $(document).ready(function(){ $('.collapsible').collapsible(); }); };
wiki
Comments
Post a Comment