Alert als checkbox niet is aangevinkt.

Status
Niet open voor verdere reacties.
yammaski

yammaski

Gebruiker
Lid geworden
9 mrt 2005
Berichten
284
Als je op de submit button klikt verdwijnt deze en zie je een wieltje tot de volgende pagina geladen is.
Maar de checkbox moet aangevinkt zijn.
Hoe pas ik de code hiervoor aan ?

testpagina


Yam.
 
Code: 
<script type="text/javascript">
	function validateCheckbox()
	{
		checkbox = document.getElementById('checkbox');
		if(checkbox.checked == false)
		{
			alert('Please agree with the checkbox');
			return false;
		}
		else
		{
			return true;	
		}
	}
</script>

<form action="" method="post">
	<input type="checkbox" name="checkbox" id="checkbox" /><label for="checkbox">I agree</label><input type="submit" onclick="return validateCheckbox()" value="confirm" />
</form>
 
Bedankt.

Het wieltje (loader_indicator2.gif) draait niet, aan wat kan dat liggen ?
Als je de gif opent in explorer draait het wel.


Yam.
 
Vreemd ... het werkt in Firefox en Chrome, maar niet in IE8 en IE9.

Het zit misschien in de "style" (<div id="loading2" style="display:none;"><img src="loader_indicator2.gif" alt="" />Loading!</div>).
Als ik dit verwijder zie je het wieltje constant, maar dan draait het wel.
 
Het schijnt dat IE problemen heeft met het tonen van geanimeerde gif's als deze eerst verborgen waren.
Probeer eens de image pas toe te voegen als hij nodig is.
dus in palats van .show() .appen() (jquery)
 
Hoe en waar pas ik dit aan ?
[JS]<script type="text/javascript">
<!--
(function (d) {
d.getElementById('Confirm').onsubmit = function () {
d.getElementById('Bevestig').style.display = 'none';
d.getElementById('loading2').style.display = 'inline';
};
}(document));
//-->
</script>[/JS]
 
Nou op de plek waar je de afbeelding gewoonlijk tevoorschijn tovert zorg je nu dat ie in de DOM geplaatst wordt.
 
Ik ben geen programmeur, dus ik weet niet hoe ik hieraan moet beginnen. :o
 
Dit is ook scripten en geen programmeren haha.
Ik werk zelf altijd met het jQuery framework, vind ik zelf vele malen makkelijker en fijner dan Javascript zelf.
Onderstaande code doet wat je wilt, maar dan geschreven in jQuery.
Let er op dat je ook de jQuery inlaadt met de bovenste regel.

[js]
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('#Confirm').submit(function()
{
$('#Bevestig').hide(); //De hide functie zet de display: none op het element.
// In jQuery ook te schrijven als $('#Bevestig').css('display', 'none');
$(body).append('<div id="loading2"><img src="loader_indicator2.gif" alt="" />Loading!</div>'); // de append functie voegt hetgeen tussen de '' toe aan het eerder genoemde element, in dit gevla de body

});
});
</script>
[/js]
 
Ik heb dit script toegevoegd in de <head>, maar het wieltje draait nog steeds niet in IE !?
 
Verversen met CTRL+F5 want waarschijnlijk zit er iets in je cache vast.
Hij doet het hier gewoon dus als het alleen bij jou gebeurd niet te veel op letten ;)
 
Deze versie werkt niet meer.
Haal dat oude script onder het formulier er eens uit, met de display none en inline.
Die heb je nu namelijk niet meer nodig.
 
Laatst bewerkt:
Sorry ... dan verschijnt er niets meer.
Heb ook al geprobeerd de div in het form "leeg te laten" : <div id="loading2"></div>

check testpage
 
sorry ... het blijft chinees voor mij :o

heb het anders opgelost aan de hand van een scriptje gevonden op het net dat werkt met verschillende images ipv 1 animated gif

testpage
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan