Ben bezig met een soort webshop.
Heb een scriptje gemaakt om alle aanbiedingen weer te geven.
Onder elk item wil ik extra informatie laten zien na het klikken van de meer info button.

Als ik bij product 1 op meer info klik komt eronder meer info.
Als ik bij product 2 op meer info klik komt onder product 1 meer info over product 1.
Dit is uiteraard niet de bedoeling, ik denk dat de oplossing ligt in het product id die als hidden veld in het formulier zit.
Kan iemand mij op weg helpen? Hieronder een deel van het scriptje die alle informatie uit een mysql database haalt.
Bij voorbaat dank voor uw hulp.

[script]
<?php
$current_url = urlencode($url="http://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']);
$sql = ("SELECT * FROM producten WHERE aanbieding = 1");
if (!$result = $mysqli->query($sql))
{
trigger_error('Fout in query: '.$mysqli->error);
}
else
{
if ($mysqli->affected_rows > 0)
{
while ($row = $result->fetch_assoc())
{
echo '<div id="actionblok-item">';
echo '<form name="actionblok_form" method="POST" action="cart_update.php">';
echo '<table>';
echo '<input type="hidden" name="id" value="'.$row['id'].'" />';
echo '<input type="hidden" name="type" value="add"/>';
echo '<input type="hidden" name="return_url" value="{$current_url}"/>';
echo '<tr><td><img src="../'.$row['image'].'"/></td>';
echo '<td class="product-title">'.$row['name'].' </td>';
echo '<td class="new-img"><img src="../images/new.jpg"/></td></tr>';
echo '<tr><td class="product-price">'.$row['price'].'Euro</td>';
echo '<td class="product-aantal"><input type="text" size="2" maxlength="2" name="qty" value="1"/></td>';
echo '<td class="product-order"><button class="submit-order" name="submit"></button></td></tr>';
echo '<tr><td><input type="button" onclick="document.getElementById(\'productInfoPopup\').style.display=\'block\'" value="Meer info"></button></td></tr>';
echo '<tr><td><div id="productInfoPopup"><h4>Product Informatie</h4><p>'.$row['description'].'</p></div></td></tr>';
echo '</div></div></table></form></div>';
}
else
{
echo "Er zijn geen aanbiedingen vandaag.";
}
}
?>
Hi Jos,

je moet wel de 'quotes' in de gaten houden.

het script in de 'onClick' attribute staat binnen " "
zoals je hier ziet in je vorige stukje code, staat onclick="document.getElementById(" hier zie stopt de 'onclick'.
Daarom gebruiken we verschillende 'quotes' om dit te voorkomen, aangezien je met php echo'd kun je de enkele quote 'escapen' door \ ervoor te zetten.
Je eerste stukje code was beter, je hoeft alleen de $i toe te voegen:

echo '<tr><td><input type="button" onclick="document.getElementById(\'productInfoPopup' . $i . '\').style.display=\'block\'" value="Meer info"></button></td></tr>';

De output zal dan wezen:

<tr><td><input type="button" onclick="document.getElementById('productInfoPopup1').style.display='block'" value="Meer info"></button></td></tr>

En daar zie je dan goed dat onclick binnen " " valt, en de overige quotes enkel ' ' zijn

p.s. ozzie heeft aangegeven dat hij het niet getest heeft, dus let altijd op de quotes
>> p.s. ozzie heeft aangegeven dat hij het niet getest heeft, dus let altijd op de quotes

Ik had het inderdaad niet getest ... maar die quotes heb ik waarschijnlijk zelf kapotgemaakt (oeps). Ik dacht dat die verkeerd stonden en had ze gelijk maar even aangepast. Niet slim dus :-) Mijn excuses.

Hopelijk werkt het na de correctie van Dennis nu wel.
Dennis bedankt, ik ga het gelijk even proberen.
Ik had niet in de gaten dat dat overal telt wat betreft de quotes.
Is niet jou schuld Ozzie ik had het zoiezo verkeerd.

Laat zo weten of het is gelukt

[size=xsmall]Toevoeging op 21/03/2017 12:16:12:[/size]

Haha Heren super bedankt!!

Het werkt:D

Weer een hoop geleerd dank jullie wel!

Groeten Jos
Mooi zo :-)

Succes ermee!
Ozzie PHP op 21/03/2017 12:06:07

>> p.s. ozzie heeft aangegeven dat hij het niet getest heeft, dus let altijd op de quotes

Ik had het inderdaad niet getest ... maar die quotes heb ik waarschijnlijk zelf kapotgemaakt (oeps). Ik dacht dat die verkeerd stonden en had ze gelijk maar even aangepast. Niet slim dus :-) Mijn excuses.

Hopelijk werkt het na de correctie van Dennis nu wel.


Hi Ozzie, ik hoop dat je dit ook niet verkeerd op pakte..
Ik probeer meer aan te geven dat je altijd zelf je quotes in de gaten moet houden, zelfs als je copy-paste van een ander :)
Niet iedereen heeft een kant en klare copy van iemand z'n project ;D
>> Hi Ozzie, ik hoop dat je dit ook niet verkeerd op pakte..

Nee hoor ;-)

Ik had zijn code in het antwoordveld geplakt en dan zie je geen kleurtjes meer. Ik dacht waarom gebruikt ie daar nu zomaar ineens ge-escapte single quotes ... gelijk maar even aanpassen naar dubbele quotes. Njah ... dat pakte dus niet goed uit :D Ik zag al aan zijn reactie wat er mis was, en jij had het gelukkig daarna goed hersteld. Dus het was een goed staaltje teamwork :)

Goed bezig
Goedemiddag,

Nou is het mooi gelukt maar ik wil dat bij het verschijnen van de extra info een X tevoorschijn komt waar je op kan drukken om het weer te laten verdwijnen.

Het is mij gelukt alleen wil ik niet dat de X er gelijk al staat maar pas verschijnt na het klikken op de meer info button hoe krijg ik dat voor elkaar ik heb het nou zo:


echo '<tr><td><input type="button" onclick="document.getElementById(\'productInfoPopup' . $i . '\').style.display=\'block\'" value="Meer info"></button></td></tr>';
echo '<tr><td><div class="hideMe" id="productInfoPopup' . $i . '"><h4>Product Informatie</h4><p>'.$row['description'].'</p></div></td></tr>';
echo '<tr><td><div class="closeMe" id="closeMe' . $i . '"><a href="#" onclick="document.getElementById(\'productInfoPopup' . $i . '\').style.display=\'none\'">X</a></div></td></tr>';


En in mijn css:

.hideMe {
display:none;
}

.closeMe {
display:block;
}

Zet de closeMe-div in de hideMe-div.
Lukt niet ik heb het nou zo als je zegt volgens mij.


echo '<tr><td><input type="button" onclick="document.getElementById(\'productInfoPopup' . $i . '\').style.display=\'block\'" value="Meer info"></button></td></tr>';
echo '<tr><td><div class="hideMe" id="productInfoPopup' . $i . '"><h4>Product Informatie</h4><p>'.$row['description'].'</p></td></tr>';
echo '<tr><td><div class="closeMe" id="closeMe' . $i . '"><a href="#" onclick="document.getElementById(\'productInfoPopup' . $i . '\').style.display=\'none\'">X</a></div></td></tr></div>';


X Blijft staan.

[size=xsmall]Toevoeging op 27/03/2017 18:45:29:[/size]

Kan ik geen 2e onclick event aan die button hangen zodat hij gelijk de x toont desnoods hidden via een hidden actie?

Reageren