javascript - .on("pagecreate") not being called -


i'm trying copy code: http://jsfiddle.net/ezanker/5qe6g/1/

i'm using goolge blogger

i've got imports in template html

<head>     <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>     <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js' type='text/javascript'/>      <script src='http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js' type='text/javascript'/>      <script src='http://code.jquery.com/jquery-1.9.1.min.js' type='text/javascript'/>     <script src='http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css' type='text/javascript'/>     <script type="text/javascript" src="/resources/scripts/jquery-1.9.1.min.js"></script>       <script type="text/javascript" src="/resources/scripts/app.ui-1.0.js"></script>          <script type="text/javascript" src="/resources/scripts/jquery.mobile-1.3.0.min.js"></script>  

problem "onpagecreate" not being called. if rid of this:

function createlist(menudata){     var html = '';     $.each(menudata,function(i,val){         html += '<div data-role="collapsible" data-inset="true" data-id='+val.productid+'><h3>'+val.name+'</h3><ul data-role="listview" data-inset="true">';         $.each(val.productoption,function(i,val){             html += '<li class="row">'+val.topping+'</li>';         });         html += '</ul></div>';     });     return html; }      var menulistitem = createlist(data);     $('#menu-content').empty().append(menulistitem);     $('div[data-role=collapsible]').collapsible();     $('div ul').listview(); 

it draws menu, not collapsible. i'm assuming reason not collapsible timing off

anyone know how fix this?

thanks!

the problem in head tag of html file. first of don't need multiple load of same files. problem put jquery.mobile-1.4.5.min.css css file in script tag. css file need come in link tag:

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"> 

after clearing unnecessary loading of jquery head tag external resources need this:

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"> <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 

check out working code : codepen


Comments

Popular posts from this blog

sql server - Cannot query correctly (MSSQL - PHP - JSON) -

php - trouble displaying mysqli database results in correct order -

C++ Linked List -