Prijs uitrekenen

Status
Niet open voor verdere reacties.
T

thebeatproducer

Gebruiker
Lid geworden
10 jan 2010
Berichten
19
hallo,

Ik ben bezig met een site te ontwerpen, en ik wil graag dat mijn klanten zelf hun uiteindelijke prijs kunnen uitrekenen. Zelf weet ik niks van javascript, laat staan dat ik het kan ontcijferen, dus wil ik jullie om een gunst vragen:

Zou een van jullie een stukje kunnen programmeren, dat ik zo copy,paste in mijn broncode kan plakken ?

Ik zou graag zoiets hebben :

helpmij.jpg


Alvast Bedankt !

Joost
 
Zou een van jullie een stukje kunnen programmeren, dat ik zo copy,paste in mijn broncode kan plakken ?programmeren
Klik om te vergroten...
nope, maar ik kan wel een paar hints geven:
1. als je een input-checkbox een onclick-javascript code geeft, kan je hier aan prijzen koppelen
2. Je kan dan zelfs de 'bereken' knop weglaten en alles automatisch laten doen
3. weg met dat veld, gewoon text als uikomst!​
nu, het idee:
HTML: 
<!-- hier komt het resultaat in te staan -->
<span id='resultaat'>0</span>

<!-- je checkbox voor een waarde -->
<input type='checkbox' onclick='bereken(5, this);'>
[JS]var resultaat = document.getElementById('resultaat');
/* dit is de handle van je totale waarde */

function berekenCheck(extra, cb)
{
/* voegt parameter 'extra' toe aan prijs, of haalt deze eraf */
if(cb.checked === true)
{
resultaat.innerHTML = parseInt(resultaat.innerHTML) + extra;
}else{
resultaat.innerHTML = parseInt(resultaat.innerHTML) - extra;
}
}[/JS]voila.


Overgens is hier de complete test-pagina: testje.html
HTML: 
<html>
<body>
<input type='checkbox' onclick='berekenCheck(5, this);'>
<span id='resultaat'>0</span>
<script>
var resultaat = document.getElementById('resultaat');

function berekenCheck(extra, cb)
{
   if(cb.checked === true)
   {
      resultaat.innerHTML = parseInt(resultaat.innerHTML)  + extra;
   }else{
      resultaat.innerHTML = parseInt(resultaat.innerHTML)  - extra;
   }
}
</script>
</body>
</html>

Het is overgens de bedoeling dat je eerst zelf probeert, niet ons het werk laat doen (tenzij je betaalt ;)). Voor een begin in Javascript kan je de w3c-tutorial volgen: http://www.w3schools.com/JS/default.asp

:thumb:
 
Laatst bewerkt:
HTML: 
<fieldset id='kostenberekening'>
                <legend>Offerte</legend>
                <p>
                    <label for='uren'> Aantal uren </label>
                    <input id='uren' type='text' />
                </p>             
                <p>
                    <input id='regio' type='checkbox' value='5' />
                    <label for='regio'> Buiten Regio [&#8364; 5 extra]</label>
                </p>
                <p>
                    <input id='moonflower' type='checkbox' value='5' />
                    <label for='moonflower'> Moonflower [&#8364; 5 extra]</label>
                </p>
                <p>
                    <input id='rookmachine' type='checkbox' value='5'/>
                    <label for='rookmachine'> Rookmachine  [&#8364; 5 extra]</label>
                </p>
                <p>
                    <input id='karaoke' type='checkbox' value='5'/>
                    <label for='karaoke'> Karaoke set  [&#8364; 5 extra]</label>
                </p>
                <p>
                    <label for='kosten'>Totaal:</label>
                    <div id='kosten'>&nsbp;</div>
                </p>
            </fieldset>

PHP: 
         <script>
        //Even snel simpele event registratie
        window.onload = registerKostenBerekening;
        var $velden;
        //De functie
        function registerKostenBerekening() {
            //alle inputvelden binnen de kostenberekening ophalen in een verzameling
            $velden = document.getElementById('kostenberekening').getElementsByTagName('input');
            
            //door de verzameling loopen
            for ( var $i = 0; $i < $velden.length; $i++ ) {
                // onderscheid maken tussen het inputveld en de checkboxes
                if ( $velden[$i].getAttribute('type') == 'text' ) {
                    //Als een toets losgelaten wordt in het inputveld de berekenKosten functie aanroepen
                    $velden[$i].onkeyup = berekenKosten;
                } else
                if ( $velden[$i].getAttribute('type') == 'checkbox' ) {
                    //Wanneer een checkbox wordt aangeklikt de berekenKosten functie aanroepen
                    $velden[$i].onclick = berekenKosten;
                }
            }
            //berekening uitvoeren voor als het een refresh betreft
            berekenKosten();
        }
        
        function berekenKosten() {
            //variabele om het totaalbedrag in op te slaan
            var $totaal = 0;
            
            //door de verzameling loopen
            for ( var $i = 0; $i < $velden.length; $i++ ) {
                // onderscheid maken tussen het inputveld en de checkboxes
                if ( $velden[$i].getAttribute('type') == 'text' ) {
                    //waarde van input ontdoen van niet numerieke karakters
                    $velden[$i].value = $velden[$i].value.replace(/[^0-9]/g,"");
                    //het aantal uren * 20 en bij het totaal voegen
                    $totaal += $velden[$i].value * 20;
                } else
                if ( $velden[$i].getAttribute('type') == 'checkbox' ) {
                    //Wanneer de checkbox aangevinkt is;
                    if($velden[$i].checked) {
                        //de waarde van de checkbox bij het totaal optellen
                        $totaal += parseInt($velden[$i].value);
                    }
                }
            }
            //Het totaalbedrag in de kosten-div plaatsen
            document.getElementById('kosten').innerHTML = "&#8364; " + $totaal;
        }
    </script>
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan