Jquery mobile data-role="collapsible" doesn't work with ajax get. You can find my code bellow. Here is my problem when I open my page the collapsible data is shown in one bloc. Am I missing something I really need help. Thank you
<html lang="fr"> <head> <!-- Carracteres --> <meta charset="utf-8"> <!-- Carracteres --> <!-- Desactiver le zoom --> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> <!-- Desactiver le zoom --> <!-- CSS Animation --> <link rel="stylesheet" href="css/stylish-portfolio.css"> <link rel="stylesheet" href="css/font-awesome.min.css"> <link rel="stylesheet" href="css/jquery.mobile.css"> <!-- CSS Animation --> </head> <body> <div class="loader"></div> <!-- Page d'accueil --> <div data-role="page" class="touch" style="width:100%;background:#000;" id="indexpage"> <div class="topbardiv"><p style="color: #fff;font-size: 18px;line-height: 44px;">A venir</p></div> <div style="height:46px;"></div> <!-- Text --> <div style="background-color:#000;" id="avenir"></div> <!-- Text --> <a href="#right-panel" data-icon="arrow-l" data-iconpos="notext" data-shadow="false" data-iconshadow="false" class="ui-icon-nodisc"><img class="animated infinite pulse" style="height: 19px;padding: 6.25px 6.25px 6.5px 6.5px;position: fixed;top: 5;right: 5;z-index: 9999999999;" src="img/menu.png"></a> <div data-role="panel" id="right-panel" data-display="push" data-position="right"> <li> <div class="logomenudiv"><img class="logomenu" src="img/logo.png"></div> </li> <li> <p onclick = $("#menu-close").click();location.href='#qui_popup'; style="padding-top: 10px;padding-left: 10px;"><i class="fa fa-users" aria-hidden="true"></i> Le CAFÉ THÉÂTRE</p> </li> <li> <p onclick = $("#menu-close").click();location.href='#tarifs_popup'; style="padding-left: 10px;"><i class="fa fa-ticket" aria-hidden="true"></i> Tarifs et abonnements</p> </li> <li> <p onclick = $("#menu-close").click();location.href='#tapas_popup'; style="padding-left: 10px;"><i class="fa fa-glass" aria-hidden="true"></i> Tapas et Cocktails</p> </li> <li> <p onclick = $("#menu-close").click();location.href='#venir_popup'; style="padding-left: 10px;"><i class="fa fa-map-marker" aria-hidden="true"></i> Venir au CAFÉ THÉÂTRE</p> </li> <div style="margin-top: 25px;text-align: center; width:100%;"> <a href="tel:0651809690" style="display:inline"><img src="img/tel.png" style="width: 45px;"></a> <a href="mobincube://action/sms/0651809690%20Bonjour%2C" id="doubleLink" style="display:inline"><img src="img/twitter.png" style="width: 45px;"></a> <a href="mailto:defoncederire@gmail.com" style="display:inline"><img src="img/mail.png" style="width: 45px;"></a> <a href="mobincube://action/browser/https%3A%2F%2Fwww.facebook.com%2Fdefoncederire%2F%3Ffref%3Dts" style="display:inline"><img src="img/facebook.png" style="width: 45px;"></a> <a href="mobincube://action/browser/http%3A%2F%2Fwww.defoncederire.com%2F" style="display:inline"><img src="img/internet.png" style="width: 45px;"></a> </div><!-- /panel --> </div> </div> <!-- Page d'accueil --> <!-- Qui sommes nous popup --> <div data-role="page" class="touch" style="width:100%;background:#000;" id="qui_popup"> <div class="topbardiv"><p style="color: #fff;font-size: 18px;line-height: 44px;">Défonce de Rire</p></div> <div style="height:46px;"></div> <!-- Text --> <div style="height:100%;width;100%;background:#000;"> <img src="img/1.jpg" width="100%"> <div style="padding:10px;background:#000;"> <p style="text-align:center;">Horaires des Spectacles<br> Du mercredi au samedi : 20h00<br> Dimanche : 15h00<br> <br> *Ouverture des portes 1h00 avant le début du spectacle<br> *Fin du service 15 minutes avant le début du spectacle<br> + Restez après le spectacle, le bar ouvre de nouveau et profitez d'un moment pivilégié avec les comédiens<br></p> </div> </div> <!-- Text --> <div onclick="location.href='#indexpage';" class="bttt1"> <img style="position: fixed;top: 0;right: 0;z-index: 1;height: 19px;padding: 11.25px 11.25px 6.5px 6.5px;" src="img/exit.png"> </div> </div> <!-- Qui sommes nous popup --> <!-- Tapas popup --> <div data-role="page" class="touch" style="width:100%;background:#000;" id="tapas_popup"> <div class="topbardiv"><p style="color: #fff;font-size: 18px;line-height: 44px;">Tapas et Cocktail</p></div> <div style="height:46px;"></div> <!-- Text --> <h2>Boissons</h2> <img src="img/Boissons_defonce_de_rire.png" style="width:100%"> <td> <p><strong>Pina Colada ou Mojito : 6,5€<br></strong><span style="font-size: 8pt;"><strong></strong></span><strong><br></strong><br><strong>Sirop à L'eau : 1.50€<br></strong><span style="font-size: 8pt;"><span style="font-size: 8pt;">Fraise, Menthe, Grenadine, Pêche</span><em><em>, Citron, Lichi</em></em><em><br></em></span><strong>Diabolo : 2.00€<br></strong><span style="font-size: 8pt;">Fraise, Menthe, Grenadine, Pêche</span><em><em>, Citron, Lichi<br></em></em><strong>Jus de Fruits : 2.50€</strong><em><em><br></em></em><span style="font-size: 8pt;">Orange, Tomate, ACE, Ananas, Fraise, Abricot, Lichi</span><br><strong>Sodas : 2.50€</strong><strong><br></strong><span style="font-size: 8pt;">Coca-Cola, Ice-Tea, Perrier, Orangina, Limonade</span><br><strong>Bières bouteille : 3.50€</strong><br><span style="font-size: 8pt;">Guiness, Leffe, Corona, Desperados, Hoegaarden</span><br><strong>Kir : 4.00€<br></strong><span style="font-size: 8pt;">Mûre, </span>cassis, violette<br><strong>Kir Royal : 5€<br><br>Vin Rouge/Rosé/Blanc au verre : 3.5€<br>Vin <strong>Rouge/Rosé/Blanc</strong> à la Bouteille : 15€</strong><br><span style="font-size: 8pt;"></span></p> <p><strong>Thé et Tisane: 2€</strong><br><span style="font-size: 8pt;">Choisissez votré parfum dans notre Coffret de saveurs variées.</span><br><br><strong>Café : 2€</strong><br><span style="font-size: 8pt;">Café double expresso artisanal ou café allongé </span><br><strong> </strong></p> </td> <td> <p><strong>A Grignoter : 6€</strong></p> <p><span style="font-size: 8pt;">Tapenades diverses + Olives<br></span></p> <p><span style="font-size: 8pt;"> </span></p> <p><strong><span style="font-size: 8pt;">Chiffonade de Jambon Cru : 6<strong>€</strong></span></strong></p> <br> <h2>Tapas</h2> <img src="img/tapas_defonce_de_rire.png" style="width:100%"> <p><span style="font-size: 14pt;"><strong>Les Plateaux Gourmands :</strong></span></p> <p><em><strong><br>Le Grand Fromager : 18€<br></strong></em><span style="font-size: 8pt;">Assortiment de 5 fromages d'Auvergne </span><em><span style="font-size: 8pt;"><strong><br><br></strong></span><strong>L'auvergnat : 18€</strong><span style="font-size: 8pt;"><strong><br></strong></span></em><span style="font-size: 8pt;">Ass</span><span style="font-size: 8pt;">ortiment de fromages et charcuteries</span><em><br></em><em><br><strong>Plateau Végétarien : 18<em><strong>€</strong></em></strong><br>(Sur commande 24 heures avant le spectacle ) </em></p> <p><span style="font-size: 14pt;"><strong>La touche sucrée :</strong></span></p> <p><strong>Café/Thé/Chocolat Gourmand : 6,5€</strong><br>Café, thé ou chocolat accompagné de douceurs sucrées</p> </td> <!-- Text --> <div onclick="location.href='#indexpage';" class="bttt1"> <img style="position: fixed;top: 0;right: 0;z-index: 1;height: 19px;padding: 11.25px 11.25px 6.5px 6.5px;" src="img/exit.png"> </div> </div> <!-- Tapas popup --> <!-- Tarifs et abonnements popup --> <div data-role="page" class="touch" style="width:100%;background:#000;" id="tarifs_popup"> <div class="topbardiv"><p style="color: #fff;font-size: 18px;line-height: 44px;">Tarifs et abonnements</p></div> <div style="height:46px;"></div> <!-- Text --> <div style="width;100%;background:#000;text-align:center;"> <p style="font-size: 20px;font-weight: bold;">TARIFS BILLETTERIE :</p> <img src="img/theatre.jpg" style="width:30%"> <p>-Plein Tarif : 14 €<br>-Tarif Réduit : 11 €</p> <p style="font-size: 20px;font-weight: bold;">TARIFS ABONNEMENTS :</p> <img src="img/defonce_de_rire_ABONNEMENTS_copie.jpg" style="width:30%"> <p>Carte 10 Spectacles : 105 €<br> <p style="font-size: 20px;font-weight: bold;">TARIFS PASS SPECTACLES :</p> <img src="img/pass_rire.jpg" style="width:30%"> <p>Pass Soirée : <br>-2 Personne (2 entrées spectacle + 1 Plateau 2 pers + 2 Boissons) : 50 €</p><br> </div> <!-- Text --> <div onclick="location.href='#indexpage';" class="bttt1"> <img style="position: fixed;top: 0;right: 0;z-index: 1;height: 19px;padding: 11.25px 11.25px 6.5px 6.5px;" src="img/exit.png"> </div> </div> <!-- Tarifs et abonnements popup --> <!-- Venir au café popup --> <div data-role="page" class="touch" style="width:100%;background:#000;" id="venir_popup"> <div class="topbardiv"><p style="color: #fff;font-size: 18px;line-height: 44px;">Venir au café</p></div> <div style="height:46px;"></div> <!-- Text --> <div style="height:100%;width;100%;background:#000;"> <img src="img/0.jpg" width="100%"> <div style="padding:10px;background:#000;height:80%"> <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1654.556672009112!2d3.0785118565539458!3d45.77877426203212!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47f71bdc9faf1b73%3A0x5f6b2507363449a8!2zRMOpZm9uY2UgZGUgUmlyZSAtIENhZsOpIFRow6nDonRyZQ!5e0!3m2!1sfr!2sfr!4v1466777862750" width="100%" height="200" frameborder="0" style="border:0" allowfullscreen></iframe> <div onclick="location.href='mobincube://action/route/45.7783992%2C3.0795084999999744%20Defonce%20de%20Rire';" class="venir">Venir au Café Théâtre</div> </div> </div> <!-- Text --> <div onclick="location.href='#indexpage';" class="bttt1"> <img style="position: fixed;top: 0;right: 0;z-index: 1;height: 19px;padding: 11.25px 11.25px 6.5px 6.5px;" src="img/exit.png"> </div> </div> <!-- Venir au café popup --> <!-- jQuery --> <script src="js/jquery.js"></script> <script src="js/jquery.mobile.js"></script> <!-- jQuery --> <!-- Chargement --> <script type="text/javascript"> $(window).load(function() { $(".loader").fadeOut("slow"); }) $.ajaxSetup ({ cache: false }); </script> <!-- Chargement --> <script> document.getElementById("doubleLink").onclick = function () { window.open("sms:0651809690", "", "width=640,height=400"); } </script> <script> $(document).ready( function() { $.ajax( { type: "GET", url: "http://s604712774.onlinehome.fr/cafetheatre/doc.xml", dataType: "xml", success: function(xml) { $(xml).find('avenir').each( function() { var titre = $(this).find('titre').text(); var photo = $(this).find('photo').text(); var courtedesc = $(this).find('courtedesc').text(); var lien = $(this).find('lien').text(); var date = $(this).find('date').text(); $('<div style="background:#000;text-align: center;margin-left: 10px;margin-right: 10px;margin-top: 10px;margin-bottom: 10px;border-bottom: solid 1px #fff;"><p style="text-align: center;">' +date+ '</p><img width="100%" src="' +photo+ '"><h2 style="text-align: center;font-size: 16px;padding-top: 5px;color: #ff0000;padding-bottom: 5px;">' +titre+ '</h2><div data-role="collapsible"><h4>Voir le résumé</h4><p class="body1010" style="margin-bottom:10;">' +courtedesc+ '</p></div></div>').appendTo('#avenir'); }); } }); } ); </script> </body> </html>
No comments:
Post a Comment