ik ben absoluut niet thuis in Javascript,
maar het probleem is als volgt:
Ik heb een bestelpagina waar men het aantal artikelen kan selecteren.
Wanneer 1 artikel 20 euro kost en men kiest in de dropdown voor aantal: 5 stuks, dan moet het bedrag automatsch 100 euro worden.
Live op de website om het zo te zeggen. Het moet dus direct optellen.
Het bedrag staat in een DIV weergeven en volgens mij kan bovenstaande dus met ajax/javascript, maar iemand een idee waar ik zo een script vind?
<FORM NAME="productenlijst">
<INPUT TYPE="text" NAME="kwantiteit" VALUE="">
<INPUT TYPE="button" NAME="updateKnop" VALUE="+" onClick="rekenen();">
</FORM>
<script>
function rekenen(this){
var bedrag = '(hier dynamisch invullen)';
var aantal = '(zelfde met de waarde van "kwantiteit")';
eval("document.write(bedrag*aantal)");
</script>
Ik heb nu onderstaand script, werkt perfect.
Enkel, wanneer ik op de pagina bestellen kom dan moet de prijs die hij aangeeft al standaard "20" zijn, maar dat is nu "0".
Hoe pas ik dat aan?
<script type="text/javascript">
var totaalprijs = 0; // Deze variabele bevat de totaalprijs (niet aanpassen)
var prijzen = new Array(); // De array met de prijs en het aantal van het product.
prijzen[0] = new Array(2.35, 0); // De eerste 0 is het id, 2.35 is de prijs van product 0, en 0 het aantal.
prijzen[1] = new Array(1.20, 0); // Bij deze dus alleen de prijs aanpassen.
// Met onchange="update(x, this)" in een input veld kan je dus het aantal in de array prijzen[x] aanpassen.
function update(id, veld) {
if(!veld.value.match(/([0-9]+)/)) {
alert('Vul a.u.b een aantal in.');
veld.value = 0;
} else {
prijzen[id][1] = veld.value;
totaal();
}
}
function totaal() {
totaalprijs = 0;
for (i in prijzen) {
totaalprijs = totaalprijs + (prijzen[i][0] * prijzen[i][1]);
}
document.getElementById('totaal').innerHTML = totaalprijs;
}
</script>
php is server-side dus dat zul je dan achterwegen moeten laten. Indien je gegevens uit een database nodig hebt zonder refresh zul je een kijkje naar AJAX kunnen nemen.
Maar voor een rekensom als dit zal dat niet nodig zijn, want aangezien je de prijs van het product al hebt opgehaald (het staat immers al ergens op de pagina) kun je deze waarde direct in je functie echoën.
Alleen zorgt je in jouw geval dat je de cijfer/reken knoppen weglaat op de "="-knop na, en schrijf je in je functie:
var bedrag = '<? echo $bedragvanproduct ?>';
(value van input)*bedrag
Je kunt er daarbij met javascript voor zorgen dat men alleen numerieke tekens in het veld kan voeren.
====
EDIT: Even een kijkje nemen naar je nieuwe post, ik reageerde net te vroeg
Het is me gelukt met het combineren van wat scripts, heb nu dit en dat werkt:
<script type="text/javascript">
var totaalprijs = 0; // Deze variabele bevat de totaalprijs (niet aanpassen)
var prijzen = new Array(); // De array met de prijs en het aantal van het product.
prijzen[0] = new Array(<?php echo $row_product['prod_onzeprijs']; ?>, 0); // De eerste 0 is het id, 2.35 is de prijs van product 0, en 0 het aantal.
prijzen[1] = new Array(1.20, 0); // Bij deze dus alleen de prijs aanpassen.
// Met onchange="update(x, this)" in een input veld kan je dus het aantal in de array prijzen[x] aanpassen.
function update(id, veld) {
if(!veld.value.match(/([0-9]+)/)) {
alert('Vul a.u.b een aantal in.');
veld.value = 0;
} else {
prijzen[id][1] = veld.value;
totaal();
}
}
function totaal() {
totaalprijs = 0;
for (i in prijzen) {
totaalprijs = totaalprijs + (prijzen[i][0] * prijzen[i][1]);
}
document.getElementById('prijs').innerHTML = '€ <span>' + totaalprijs + '</span>';
}
</script>
