I'm writing a page in jQuery Mobile and I have an Unordered List which contains elements like these:
<ul id="ul1" data-role="listview" data-theme="d">
<li>
<a>
<h1>Who wants to live forever</h1>
<p>Queen</p>
</a>
</li>
<li>
<a>
<h1>Personal Jesus</h1>
<p>Depeche Mode</p>
</a>
</li>
</ul>
But I want to insert elements DYNAMICALLY, searching in a MySQL database. It works, but the elements that are inserted in the UL DON'T look like the default LI in jQuery Mobile: they appear as simple text thrown in the UL. The jQuery Mobile's "Graphic" is not represented. Here's the codes:
Ajax function for searching through php:
<script>
function ricerca() {
str = document.getElementById("search").value;
if (str == "") {
document.getElementById("ul1").innerHTML = "Nulla";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("ul1").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","cerca.php?ricerca="+str+"&tipo="+document.getElementById("select-choice-0").value,true);
xmlhttp.send();
}
Here's the lines of code (in the PHP) that writes the contents in the UL:
// output data of each row
while($row = $result->fetch_assoc()) {
if($inizio == 0)
{if ($row['CodISWC'] != $prev_iswc) {
echo "<li>
<a>
<h1>". $row["NomeCanzone"]. "</h1>
<p>". $row["NomeArtista"];
$prev_iswc = $row['CodISWC'];
}
else{
echo ", ". $row["NomeArtista"];
}
$inizio = 1;
}
else{
if ($row['CodISWC'] != $prev_iswc) {
echo "</p>
</a>
</li><li>
<a>
<h1>". $row["NomeCanzone"]. "</h1>
<p>". $row["NomeArtista"];
$prev_iswc = $row['CodISWC'];
}
else{
echo ", ". $row["NomeArtista"];
}
}
}
Aucun commentaire:
Enregistrer un commentaire