Jquery werkt niet met PHP/MySQL
Ik zit met een probleem, ik heb op mijn website een PHP script draaien die in verbinding staat met MySQL. Nu Heb ik dus binnen dit script een WHILE loop zitten voor de volgende echo in voorkomt.
Code (php)
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
<?php
echo "
<div class='content'>
<div class='jq_container'>
<div class='jq_header'>$jq_header</div>
<div id='meerminder' class='jq_text'><p>$part_one</p> <p>$part_two</p></div>
</div>
</div>
";
?>
echo "
<div class='content'>
<div class='jq_container'>
<div class='jq_header'>$jq_header</div>
<div id='meerminder' class='jq_text'><p>$part_one</p> <p>$part_two</p></div>
</div>
</div>
";
?>
De laatste div (meerminder) moet dus een groot stuk tekst verstoppen en doormiddel van een link kan hij opengeklapt worden m.b.v. JQuery.
Als ik in de tabel in MySQL dus meerdere id's aanmaak dan weergeeft hij de eerste id volledig correct en werkt de JQuery netjes hoe het hoort. Maar bij de volgende id weergeeft hij wel de divjes en de $jq_header maar weergeeft hij niet de tekst eronder.
hieronder als toevoeging het Jquery script:
$( function () {
$("div#meerminder p:not(:first)").hide();
$("div#meerminder p:first").append("<a href='' class='toggle'>Toon Meer...</a>");
$(".toggle").toggle( function () {
$("div#meerminder p:not(:first)").slideDown();
$(this).text('Toon Minder...');
}, function () {
$("div#meerminder p:not(:first)").slideUp();
$(this).text('Toon Meer...');
});
});
Wie weet waar dit aan kan liggen?
Groetjes
Peter
en variabelen buiten quotes.
Probeer zoiets:
print('<div id="meerminder_' . $counter . '" class=... >');
Flip -- op 22/08/2012 18:48:12:
een element id moet uniek zijn voor de html pagina.
Probeer zoiets:
print('<div id="meerminder_' . $counter . '" class=... >');
Probeer zoiets:
print('<div id="meerminder_' . $counter . '" class=... >');
Dit had ik inderdaad over het hoofd gezien alleen de id veranderen helpt ook niet heb geprobeerd om de id die hij uit de Db haalt te koppelen aan de id van de div dus dat id"meerminder" wordt id="meerminder_1" etc etc en dit helpt niet.
Toevoeging op 23/08/2012 10:21:47:
Obelix en Idefix op 22/08/2012 18:47:34:
correct quoten: http://www.phphulp.nl/php/tutorial/php-algemeen/correct-quoten/772/
en variabelen buiten quotes.
en variabelen buiten quotes.
Bedankt voor de tip heb me script meteen aangepast weer wat geleerd. Thanx
Toevoeging op 23/08/2012 10:27:49:
Mijn script ziet er momenteel als volgt uit. Moet ik nu niet iets in het Jquery gedeelte aanpassen zodat hij het script uitvoert per id?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php
while ($row = mysql_fetch_assoc ($extract))
{
// Data ophalen
$jq_header = $row ['jq_header'];
$jq_text = $row ['jq_text'];
$counter = $row ['id'];
$part_one = substr ("$jq_text", 0, 440); // Het eerste deel
$part_two = substr ("$jq_text", 440); // Het laatste deel
// Data laten zien
print ('
<div class="content">
<div class="jq_container">
<div class="jq_header"> '. $jq_header .'</div>
<div id="meerminder_' . $counter . '" class="jq_text"><p> '. $part_one .' </p> <p> '. $part_two.' </p></div>
</div>
</div>
');
}
?>
while ($row = mysql_fetch_assoc ($extract))
{
// Data ophalen
$jq_header = $row ['jq_header'];
$jq_text = $row ['jq_text'];
$counter = $row ['id'];
$part_one = substr ("$jq_text", 0, 440); // Het eerste deel
$part_two = substr ("$jq_text", 440); // Het laatste deel
// Data laten zien
print ('
<div class="content">
<div class="jq_container">
<div class="jq_header"> '. $jq_header .'</div>
<div id="meerminder_' . $counter . '" class="jq_text"><p> '. $part_one .' </p> <p> '. $part_two.' </p></div>
</div>
</div>
');
}
?>
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
function show_stuff(button, div) {
$(function() {
$(div).hide();
$(button).click(function() {
var options = {};
$(div).toggle("blind", options, 500);
});
});
}
$(function() {
$(div).hide();
$(button).click(function() {
var options = {};
$(div).toggle("blind", options, 500);
});
});
}
en dan in je html kan je een stukje javascript aanroepen:
Code (php)
1
<script>show_stuff("#meerminder_<?=$counter?>", "#meerminder2_<?=$counter?>");</script>
Gewijzigd op 23/08/2012 13:21:30 door Flip --
Zo wil ik het dus niet hebben omdat er veel van die dingen dan op 1 pagina moeten komen.
Een class is voor het selecteren van een groep van elementen. Meerdere elementen kunnen dus dezelfde class hebben.
Met die twee kenmerken kan je verder. De eventhandler laat je reageren op een class, waardoor je met 1 event handler in jquery dezelfde functie kan hangen aan alle divjes.
In die functie lees je het id uit en op basis van dat id klap je iets open. Grofweg:
Code (php)
1
2
3
2
3
$('.jq_header').click(function(){
var id = $(this).nextAll('.jq_text').first().attr('id');
});
var id = $(this).nextAll('.jq_text').first().attr('id');
});
Deze code gaat dus als de gebruiker op een jq_header div klikt en pakt het id van de eerstvolgende jq_text div.
Ga hier vanavond ff mee stoeien in het script ben weer een hoop te weten gekomen.
Toevoeging op 24/08/2012 08:31:22:
Ik heb hem eindelijk aan de praat gekregen jongens allemaal heel erg bedankt.
Dat zit standaard in JQuery-Ui Demo