Hoe kan ik het beste jQuery combineren met php
Ik heb een foreach(), en daar wil ik jQuery binnen gebruiken.
nu zit ik het volgende probleem:
Als ik 10x op de eerste regel van de foreach() klik, opent de jQuery dialog 10x met in ieder dialog verschillende namen. Ik maak ook gebruik van een tabel.
Hoe kan ik dit oplossen en wat is de beste manier om te maken?
Code (php)
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.js"></script>
<script type="text/javascript">
$(window).load(function(){
$("#test").click(function() {
$("#dialog").dialog({ show: 'fade', hide: 'drop' });
});
});
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.js"></script>
<script type="text/javascript">
$(window).load(function(){
$("#test").click(function() {
$("#dialog").dialog({ show: 'fade', hide: 'drop' });
});
});
</script>
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
foreach($data as $row)
{
echo '
<tr id="test" data-player-name="'.$row['username'].'">
<td><img src=images/'.$avatar.' ??/></td>
<td>'.$row['username'].'</td>
<td>'.$row['rank'].'</td>
</tr>';
}
echo '
<div id="dialog"><h3>'.$row['username'].'</h3>
';
//include('test.php');
echo '</div>';
{
echo '
<tr id="test" data-player-name="'.$row['username'].'">
<td><img src=images/'.$avatar.' ??/></td>
<td>'.$row['username'].'</td>
<td>'.$row['rank'].'</td>
</tr>';
}
echo '
<div id="dialog"><h3>'.$row['username'].'</h3>
';
//include('test.php');
echo '</div>';
- Ariën -:
Typfout uit titel gehaald
Gewijzigd op 11/06/2017 12:48:01 door - Ariën -
Als je een request doet om een pagina te bekijken, wordt eerst PHP uitgevoerd, waarna de browser op zijn beurt de HTML en JavaScript uitvoert.
Als je dus data uit PHP op wilt halen zul je moeten kijken naar AJAX. Dit kan met de $.ajax(), $.post() en $.get() functie in jQuery. Als je data uit PHP wilt ophalen om deze asynchroon in te laden (vooral zeer ideaal voor externe servers waarbij je niet lang wilt wachten) dan moet je die data serverside tot bijv. een makkelijk geformat JSON-feed vormen.
Onthoud wel dat AJAX een middel is, en geen doel. ;-)
De ene browser houdt het na het vinden van het eerste element voor gezien (er kan er immers maar 1 zijn) terwijl een ander vrolijk verder zoekt.
Beter is het om bijvoorbeeld een class op te nemen. Daarmee voorkom je in je eigen scripting ook dat je uitgaat van $('#test') gaat 1 element vinden, en je er toch 10 laat reageren.
Eventueel zou je hier nog een container (div oid) met een id omheen kunnen zetten om het gebied waarbinnen de click-functionaliteit actief zou moeten zijn af te bakenen. Dit id zou je dan op kunnen nemen in je selector, in combinatie met de class.
Voor een grafisch effect (althans hier lijkt het op?) voor een pagina die alle informatie al ingeladen heeft is in principe geen AJAX nodig.