[JS] Probleempje Checkbox

[Verwijderd]

Goed, mijn eerste topic hier. Ik hoop dat de topictitel zo goed is, met die toevoeging [JS] :-D

Ik zit met een Javascript-probleempje.

Ik ben bezig met een winkelwagentje in een bestaande site, maar daarin moet het volgende gebeuren:

D.m.v. een checkbox kunnen klanten aangeven of ze de bestelling komen ophalen of dat het thuis wordt bezorgd (zoals standaard is). Maar goed, zodra die checkbox wordt aangevinkt, moet de verzendkosten op 0 worden gezet.

Heb even zitten testen met javascript-codes, maar het lukt me niet om de functie goed aan te roepen. (ben nog niet zo heel bekend met Javascript, zoals misschien wel blijkt.

De code die ik heb is als volgt:

In de header :
<script language="javascript" type="text/javascript">

function CheckChange()
{
alert("test");
}

</script>

In de body :

<form name="Afhaal">
<div class="basket1"><input type="checkbox" name="checkbox" id="checkbox" value="ja" onChange="CheckChange()"></div>
</form>

Ik heb hier al diverse variaties op geprobeerd, maar het lukt me niet om een alert-venstertje te krijgen op het moment dat de pagina ververst wordt. (dit is dus alleen om te testen, want de rest van de functie kan ik dan wel zelf invullen (hoop ik)).

Iemand enig idee wat ik verkeerd doe?

[nemesis_]

gebruik eens onClick ipv onChange

maar het lukt me niet om een alert-venstertje te krijgen op het moment dat de pagina ververst wordt.

Wat bedoel je hiermee? Je wil toch meteen de verzendkosten op 0 zetten zodra iemand klikt op die checkbox?

[ Voor 78% gewijzigd door nemesis_ op 12-06-2006 12:33 ]

[Verwijderd]

Die alert had ik alleen ingevoerd om te testen of de functie wel zou worden uitgevoerd. Heeft dus niets met de daadwerkelijke bedoeling van de functie te maken.

Maar ik had inderdaad al gevonden dat ik OnClick moest gebruiken. OnChange is alleen bedoeld voor Textarea's, Selectlijsten en Inputvelden, toch? En dan moet het ook in een Form staan, voor zover ik begreep.

Maar goed, het alert-venstertje verscheen dus inderdaad netjes zodra ik de checkbox aanvinkte. Nu moet ik dus alleen nog een scriptje schrijven om de verzendkosten te veranderen, zodra de checkbox wordt aangevinkt/uitgevinkt.

[bRight]

onclick (lowercase dus) is beter

[Verwijderd]

bRight schreef op maandag 12 juni 2006 @ 13:57:
onclick (lowercase dus) is beter

Maakt dat heel veel uit dan?

[nemesis_]

Verwijderd schreef op maandag 12 juni 2006 @ 14:44:
Maakt dat heel veel uit dan?

Qua functionaliteit niet, maar attributen horen nou eenmaal lowercase

[Verwijderd]

OK, op die manier.

Goed, even een kleine update:

Ik heb net de leverancier (van het pakket waar ik in bezig ben voor mijn werk) gesproken en hij gaf me een andere oplossing, zonder Javascript, aangezien Javascript pas zou werken als de complete pagina wordt gerefreshed of zo...?

Maar goed, hij gaf dus aan dat ik de pagina moet refreshen op het moment dat de checkbox wordt aangevinkt of uitgevinkt en aan de hand van die refresh dus de verzendkosten moet aanpassen.

Moet nu dus alleen even opzoeken hoe ik die refresh meegeef aan dat aan-/uitvinken van die checkbox en tegelijkertijd een variabele meestuur, zodat die verzendkosten worden aangepast.

Dus alle tips zijn welkom.

[nemesis_]

Je hebt helemaal geen refresh nodig om de verzendkosten op 0 te zetten en dus ook geen variabelen nodig.
De verzendkosten staan toch vast?
Via een onclick kan je dan een javascript functie aanroepen die de inhoud van een bepaalde div (of wat dan ook) veranderd. Als checkbox is 'checked', verander de inhoud van het element naar 0, anders naar de standaard verzendkosten.
Als je dingen opnieuw wil berekenen, zou je dit gewoon kunnen doen via javascript.

[Verwijderd]

Tja, die man die ik aan de lijn had zei, dat het voor het verloop van het bestelproces makkelijker zou zijn als ik een aparte "Paymentmethod" aan zou maken en vervolgens buiten Javascript om de pagina zou verversen en een variabele meesturen, zodra er op de checkbox wordt geklikt.

De Paymentmethod neem ik dan mee naar de volgende pagina voor de Betaalmogelijkheden en door de pagina te verversen kan de verzendkosten worden aangepast.

Volgens die man is dat dus eenvoudiger en beter voor de rest van het proces (vooral in de backoffice). Maar goed, nu moet ik dus nog uitvinden hoe ik dat ga aanpakken.

[orf]

Dat laatste klinkt nogal eens als onzin. Probeer eens zoiets:

JavaScript:

function doeIets(checked){
  if (checked){
    alert('checked');
  }
}

HTML:

<input onclick="doeIets(this.checked)" name="foo" value="bar" />

[nemesis_]

Wie is die man aan de lijn? Jij bent toch de ontwikkelaar? Dan beslis jij dus wat er gebeurt.

[Verwijderd]

nemesis_ schreef op dinsdag 13 juni 2006 @ 08:24:
Wie is die man aan de lijn? Jij bent toch de ontwikkelaar? Dan beslis jij dus wat er gebeurt.

Die man is van de customer support van de pakketleverancier, dus die heeft er iets meer verstand van als ik.

En ik ben slechts een stagiair, dus zoveel bevoegdheden heb ik nog niet.

[Verwijderd]

het domme is dat je ook nu nog javascript moet gebruiken namelijk om je form te submitten

HTML:

<input type="checkbox" name="verzendkosten" onclick="this.form.submit()" value="1"/>

hiermee submit je het form. In je php/asp/whatever code moet je nu gaan kijken of verzendkosten is aangevinkt

[ Voor 10% gewijzigd door Verwijderd op 13-06-2006 09:45 . Reden: iets vergeten ]

[wizzkizz]

Die suggestie van die "man aan de lijn" is helemaal zo gek nog niet, als je het alleen met javascript doet fop je eigenlijk alleen de gebruiker, omdat je het wel in je frontend aanpast maar niet in je backend. Het wordt pas aangepast in je backend op het moment dat je een call daarnaar maakt met de opdracht de verzendmethode aan te passen.

Dit kun je doen op het moment dat er iets veranderd wordt (en dan is AJAX handig, hoewel imho niet aan te bevelen voor een website, dat moet ook zonder js kunnen werken), of op het moment dat er op een volgende-knop geklikt wordt.

[Verwijderd]

Goed, ik ga het dus nu proberen op te lossen zonder Javascript, voor zover dat mogelijk is.

Heb inmiddels besloten om met radiobuttons te gaan werken, maar dat maakt weinig verschil voor de rest van de HTML.

Iemand enig idee hoe ik bij het aanklikken van een radiobutton de pagina kan verversen en de status van de radiobutton behoud? Ik zal standaard 1 van de 2 radiobuttons aanzetten, maar als de ander geselecteerd wordt, wil ik wel dat dit zo blijft als de pagina ververst.

[nemesis_]

Je zal daarvoor een variabele mee moeten geven. Je krijgt dan iets als: www.domein.nl/?foo=bar waar foo de variabele is en bar de waarde. Dit kan je dan afvangen in je php/asp/whatever.

[Verwijderd]

Die variabele meegeven was ik sowieso al van plan, om op die manier de verzendkosten te kunnen veranderen.

Maar als ik radio 1 standaard aanzet en radio 2 wordt geselecteerd, blijft dit dan zo als de pagina wordt gerefreshed? Of moet ik dan een extra stukje script/HTML toevoegen?

[nemesis_]

Je zal de radiobuttons (of in ieder geval aangeven of ze geselecteerd moeten worden) dynamisch moeten tonen.
Dat gaat niet (zou je niet moeten doen in ieder geval) via html. Dit moet je doen via php/asp/whatever.

PHP:

if ($_GET['foo'] == "true") {
   echo '<input type="radio" name="foo" value="true" checked="checked" />';
   echo '<input type="radio" name="foo" value="false" />';
} else {
   echo '<input type="radio" name="foo" value="true" />';
   echo '<input type="radio" name="foo" value="false" checked="checked" />';
}

foo bevat dus de aangeklikte waarde. Als deze de waarde 'true' meekrijgt via www.domein.nl/?foo=true dan wordt die geselecteerd, zo niet dan wordt 'false' geselecteerd.

[ Voor 22% gewijzigd door nemesis_ op 13-06-2006 12:54 . Reden: typo ]

[Verwijderd]

Dit:

Goed, ik ga het dus nu proberen op te lossen zonder Javascript, voor zover dat mogelijk is.

en dit:

Iemand enig idee hoe ik bij het aanklikken van een radiobutton de pagina kan verversen ...

is een onmogelijke combinatie. Je hebt altijd javascript nodig om op de onclick van de radio te submitten.

Wat wel een nette oplossing is: laat de gebruiker alles invullen. Laat hem submitten en bereken daarna pas de prijs.