Weet iemand toevallig een tutorial of een website waar de code staat om zoiets te maken zoals op deze website staat:

http://themes.jozoor.com/invention/white/contact.html

Als je hier op de "send message" button drukt opent er zich bovenaan het form een
alert box die de opmerkingen bevat, ik zou hetzelfde moeten hebben.

Alvast bedankt!
Een alertbox zou ik het niet echt noemen.
Het is gewoon een gestyled divje, die verschijnt als de invoer niet geldig is.
ik zoek gewoon een tutorial om het volgende te doen:

in het begin is de alert box er niet.
Indien de gebruiker mijn form submit zonder naam wil ik een error in de alert box met vul je naam in.
en zo voor al mijn velden ...
De invoer controleer ik wel met php of het aanwezig is.

Heb je toevallig een tutorial aar ? :)
Het is gewoon in CSS gestyled. En een if-je in PHP kan ervoor zorgen dat hij pas op het juiste moment getoond kan worden.

Een tutorial heb ik niet hier voor, gezien dit basis is van een standaard tutorial over PHP en CSS.
Ik heb het volgende gevonden maar het wil niet werken:

html:
<form action="" method="post" id="ajax-login-form">
...
<span id="message" class="error_message hidden"></span>

<input type="submit" name="submit" value="login"/>
</form>
<script>
$(document).ready(function(){
$("#ajax-contact-form").submit(function(){
var str = $(this).serialize();
$.ajax({
type: "POST",
url:"login.php",
data: str,
success:function(result) {
$("#message").html(result);
$("#message").removeClass('hidden')
}
});
return false;
});
});
</script>

En in script staat dit:

<?php

echo "dit is een test!";

?>

Maar uiteindelijk verschijnt er niks in <span id="message" class="error_message hidden"></span>.

Kan iemand mij helpen, alvast bedankt!
Heb je jQuery wel ingeladen?
ja dit staat in de head:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

En komt hij wel in het success-event? Plaats daar eens een alert ofzo?
En maak ook eens een error-event aan?

error: function (data) {
alert('Fout:' + data);
}
Omg wat ben ik toch een verstrooid persoon, ...

id van het form heet ajax-login-form
en in het javascript zeg ik het volgende:
$("#ajax-contact-form").submit(function(){
En daar kijk ik dus ook overheen :-P
Opgelost dus?
ja heel erg bedankt trouwens dat je je tijd er wou insteken :)

Reageren