hallo allemaal,
Ik ben bezig met een website, en daarop moet een contactformulier komen te staan.
Ik heb er een gemaakt in JavaScript, inclusief validatie.
Nu heb ik de volgende vraag;
Waar moet het emailadres staan, waar het formulier heen verzonden moet worden. (Mijn eigen emailadres, dus)
Het formulier ziet er op dit moment zo uit:
In het <head> gedeelte:
<script language="JavaScript" type="text/JavaScript">
function checkWholeForm(Contact) {
var leeg = "";
leeg += checkDropdown(Contact.choose.selectedIndex);
if (leeg !=" ") {
alert(leeg);
return false;
leeg += checkUsername(Contact.gebruikersnaaam.value);
}
leeg += checkEmail(Contact.email.value);
leeg += isEmpty(Contact.nietleeg.value);
return true;
}
//keuzelijst
function checkDropdown(choice) {
var error = ""
if (choice == 0) {
error = "U hebt geen keuze gemaakt uit de keuzelijst.\n;"
}
return error;
}
// Naam
function checkUsername (strng) {
var error = " ";
if (strng == " ") {
error = "U hebt geen naam ingevuld.\n";
}
var magniet = /[\(\)\<\>\,\;\:\\\/\"\[\]]/]
if (strng.match(magniet)) {
error = "De naam bevat verboden tekens.\n"
}
return error;
}
//Email
function checkEmail (strng) {
var error="";
if (strng == "") {
error = "U hebt geen emailadres ingevuld\n"
}
var emailFilter=/^.+@.+\..{2,3,4,5}$/;
if (!(emailFilter.test(strng))) {
error = "Vul aub een geldig emailadres in.\n";
}
else {
var illegalChars=/[\(\)\<\>\,\\;\:\\\"\[\]]/
if (strng.match(illegalChars)) {
error = "Het e-mailadres bevat verboden tekens.\n";
}
}
return error;
}
//Invoervak
function isEmpty(strng) {
var error = "";
if (strng.length == 0) {
error = "u moet iets invullen\n"
}
return error
}
</script>
En in het <body>gedeelte:
<form name="Contact" onSubmit="java script:checkWholeForm(this);">
<table widht="100%" cellpadding="10">
<tr>
<td>Onderwerp</td>
<td><select name="choose">
<option>Kies het onderwerp</option>
<option>Vraag</option>
<option>Opmerking</option>
<option>Technische fout op de website</option>
<option>Overig</option>
</select>
</td>
<tr>
<td>Naam</td>
<td><input type="text" name="name" size="30"></td>
</tr>
<tr>
<td>Emailadres</td>
<td><input type="text" name="email" size="30"></td>
</tr>
<tr>
<td>Hier kunt u uw bericht schrijven:<br /></td><td>
<textarea name="nietleeg" rows="4" cols"20"></textarea>
</td>
</tr>
<tr>
<td><input type="submit" name="submit" value="Versturen"xxxxxxxxxx@gmail.com; <input type="reset" value="reset" />
</td>
</table>
hopenlijk kan iemand mij helpen.
Alvast bedankt!
-
FrankW
- Artikelen: 0
- Berichten: 18
- Lid geworden op: ma 22 jun 2009, 19:47
-
Lathander
- Artikelen: 0
- Berichten: 2.504
- Lid geworden op: do 26 jan 2006, 15:49
Re: [informatica] javascript contactformulier
Er zijn een hoop dingen mis met die code. Het antwoord op je effectieve vraag staat bij punt 7, daar verwijs ik dan door naar de code. Je mail adres staat rechtstreeks in het form element.
1) De syntax om Javascript aan te geven strookt niet met de internationale standaard. Correct is dit:
2) Form element was niet afgesloten.
3) Het Javascript vraagt op verschillende plaatsen waarden op, op een manier dat die ze niet kan verkrijgen. De HTML elementen moeten voorzien worden van een id-attribuut, niet enkel een name-attribuut. Het is via het id-attribuut dat Javascript deze waarden kan vinden. Name-attributen zijn nog steeds belangrijk, als je het formulier naar een server verstuurt om het te laten afhandelen. Server-software zoals PHP en ASP.NET bekijken dan de name-attributen, in tegenstelling tot Javascript die de id-attributen bekijkt.
4) Het Javascript controleert of de geselecteerde index leeg is. Zo niet komt er een foutmelding. Dus moet het volgens dit Javascript leeg zijn. Dat laat de mogelijkheid open om helemaal geen onderwerp te selecteren. Beter is indexen te gebruiken. Het Javascript zal de geselecteerde index niet kunnen controleren, als deze niet ingegeven is in de HTML. Onderaan deze post staat een opgekuiste versie van uw script, de correcte code kan je daar zien.
5) Je houdt de pagina niet echt tegen. Er is helemaal niks om je true of false waarden op te vangen. In je attribuut bij je form ook een return aanduiden. Eventjes gedaan voor je. Hoeft ook geen vermelding dat het Javascript is. Dat attribuut onSubmit is internationaal herkend en alle browsers verwachten er automatisch Javascript in, als het voorkomt.
6) Je controle op illegale karakters in de e-mail werkt niet. Waarschijnlijk een slechte reguliere expressie. Als je even kan zeggen welke karakters je wil verbieden, zal ik kijken of ik die ook kan aanpassen.
7) Deze manier van mailen gebruikt een andere syntaxis. Aangepast in je code, hieronder te zien. Let wel op dat als je met HTML emails gaat versturen, dat niet automatisch gebeurt. Ik weet niet wat je verwachtingen zijn, maar ik kan je zeggen dat het niet zo zal zijn dat de gebruiker op "Versturen" klikt en dat het dan effectief in jouw mailbox zal zitten.
Wat er zal gebeuren is dat de browser waarmee gebruiker werkt, het formulier zal herleiden naar diens ingestelde email applicatie. Dit kan een programma zijn op de computer, dit kan een email-dienst online zijn, zoals gmail. Er zal dus een nieuw scherm openen, in de browser of via een ander programma, en daar zal de gebruiken nog eens moeten bevestigen.
Wil je dat dit allemaal niet moet, dan zul je een server moeten opzetten met PHP of ASP.NET, en de nodige pagina(s) moeten coderen om het correct af te handelen.
Je code, wat verbeterd:
1) De syntax om Javascript aan te geven strookt niet met de internationale standaard. Correct is dit:
Code: Selecteer alles
<script type="text/javascript">hier dan alle code</script>3) Het Javascript vraagt op verschillende plaatsen waarden op, op een manier dat die ze niet kan verkrijgen. De HTML elementen moeten voorzien worden van een id-attribuut, niet enkel een name-attribuut. Het is via het id-attribuut dat Javascript deze waarden kan vinden. Name-attributen zijn nog steeds belangrijk, als je het formulier naar een server verstuurt om het te laten afhandelen. Server-software zoals PHP en ASP.NET bekijken dan de name-attributen, in tegenstelling tot Javascript die de id-attributen bekijkt.
4) Het Javascript controleert of de geselecteerde index leeg is. Zo niet komt er een foutmelding. Dus moet het volgens dit Javascript leeg zijn. Dat laat de mogelijkheid open om helemaal geen onderwerp te selecteren. Beter is indexen te gebruiken. Het Javascript zal de geselecteerde index niet kunnen controleren, als deze niet ingegeven is in de HTML. Onderaan deze post staat een opgekuiste versie van uw script, de correcte code kan je daar zien.
5) Je houdt de pagina niet echt tegen. Er is helemaal niks om je true of false waarden op te vangen. In je attribuut bij je form ook een return aanduiden. Eventjes gedaan voor je. Hoeft ook geen vermelding dat het Javascript is. Dat attribuut onSubmit is internationaal herkend en alle browsers verwachten er automatisch Javascript in, als het voorkomt.
6) Je controle op illegale karakters in de e-mail werkt niet. Waarschijnlijk een slechte reguliere expressie. Als je even kan zeggen welke karakters je wil verbieden, zal ik kijken of ik die ook kan aanpassen.
7) Deze manier van mailen gebruikt een andere syntaxis. Aangepast in je code, hieronder te zien. Let wel op dat als je met HTML emails gaat versturen, dat niet automatisch gebeurt. Ik weet niet wat je verwachtingen zijn, maar ik kan je zeggen dat het niet zo zal zijn dat de gebruiker op "Versturen" klikt en dat het dan effectief in jouw mailbox zal zitten.
Wat er zal gebeuren is dat de browser waarmee gebruiker werkt, het formulier zal herleiden naar diens ingestelde email applicatie. Dit kan een programma zijn op de computer, dit kan een email-dienst online zijn, zoals gmail. Er zal dus een nieuw scherm openen, in de browser of via een ander programma, en daar zal de gebruiken nog eens moeten bevestigen.
Wil je dat dit allemaal niet moet, dan zul je een server moeten opzetten met PHP of ASP.NET, en de nodige pagina(s) moeten coderen om het correct af te handelen.
Je code, wat verbeterd:
Code: Selecteer alles
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function checkWholeForm(Contact) {
var leeg = "";
leeg += checkDropdown(Contact.choose.selectedIndex);
if (leeg == "0") {
leeg = "";
leeg += checkUsername(Contact.gebruikersnaam.value);
leeg += checkEmail(Contact.email.value);
leeg += isEmpty(Contact.nietleeg.value);
alert(leeg);return false;
}
return true;
}
//keuzelijst
function checkDropdown(choice) {
var error = ""
if (choice == 0) {
error = "U hebt geen keuze gemaakt uit de keuzelijst.\n;"
}
return choice;
}
// Naam
function checkUsername (strng) {
var error = "";
if (strng == "") {
error = "U hebt geen naam ingevuld.\n";
}
var magniet = "/[\(\)\<\>\,\;\:\\\/\"\[\]]/]";
if (strng.match(magniet)) {
error = "De naam bevat verboden tekens.\n"
}
return error;
}
//Email
function checkEmail (strng) {
var error="";
var emailFilter=/^.+@.+\..{2,3,4,5}$/;
if (!(emailFilter.test(strng))) {
error = "Vul aub een geldig emailadres in.\n";
}
else {
var illegalChars=/[\(\)\<\>\,\\;\:\\\"\[\]]/
if (strng.match(illegalChars)) {
error = "Het e-mailadres bevat verboden tekens.\n";
}
}
if (strng == "") {
error = "U hebt geen emailadres ingevuld\n"
}
return error;
}
//Invoervak
function isEmpty(strng) {
var error = "";
if (strng.length == 0) {
error = "U moet iets invullen"
allesOk = false;
}
return error;
}
</script>
</head>
<body>
<form id="contact" action="MAILTO:xxxxxxxxxx@gmail.com" onSubmit="return checkWholeForm(this);" method="post" enctype="text/plain">
<table cellpadding="10">
<tr>
<td>Onderwerp</td>
<td><select id="choose" name="choose">
<option value="0">Kies het onderwerp</option>
<option value="1">Vraag</option>
<option value="2">Opmerking</option>
<option value="3">Technische fout op de website</option>
<option value="3">Overig</option>
</select>
</td>
<tr>
<td>Naam</td>
<td><input type="text" name="name" id="gebruikersnaam" size="30"></td>
</tr>
<tr>
<td>Emailadres</td>
<td><input type="text" name="email" id="email" size="30"></td>
</tr>
<tr>
<td>Hier kunt u uw bericht schrijven:<br /></td><td>
<textarea name="nietleeg" id="nietleeg" rows="4" cols="20"></textarea>
</td>
</tr>
<tr>
<td><input type="submit" name="submit" id="submit" value="Versturen" />
<input type="reset" id="reset" value="reset" />
</td>
</table>
</form>
</body>
</html>"Invisible Pink Unicorns are beings of great spiritual power. We know this because they are capable of being invisible and pink at the same time. Like all religions, the Faith of the Invisible Pink Unicorns is based upon both logic and faith. We have faith that they are pink; we logically know that they are invisible because we can't see them."
-
FrankW
- Artikelen: 0
- Berichten: 18
- Lid geworden op: ma 22 jun 2009, 19:47
Re: [informatica] javascript contactformulier
Harstikke bedankt!
Je reactie was erg nuttig.
Groeten
FrankW
Je reactie was erg nuttig.
Groeten
FrankW
