contact-form.js
ik vond nog een mooi contact systeem op internet die ik graag zou willen bestuderen en aanpassen.
Nu vond ik een JS bestand die d'r bij zat alleen helaas weet ik niet hoe ik die moet aanpassen.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<?php
$(document).ready(function() {
$('#buttonsend').click( function() {
var name = $('#name').val();
var subject = $('#subject').val();
var email = $('#email').val();
var message = $('#message').val();
$('.loading').fadeIn('fast');
if (name != "" && subject != "" && email != "" && message != "")
{
$.ajax(
{
url: './sendemail.php',
type: 'POST',
data: "name=" + name + "&subject=" + subject + "&email=" + email + "&message=" + message,
success: function(result)
{
$('.loading').fadeOut('fast');
if(result == "email_error") {
$('#email').css({"border":"2px solid #ffb6b6"}).next('.require').text(' !');
} else {
$('#name, #subject, #email, #message').val("");
$('<div class="success-contact">U bericht is succesvol verstuurd!</div>').insertBefore('#contactFormArea');
$('.success-contact').fadeOut(5000, function(){ $(this).remove(); });
}
}
}
);
return false;
}
else
{
$('.loading').fadeOut('fast');
if( name == "") $('#name').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
if(subject == "") $('#subject').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
if(email == "" ) $('#email').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
if(message == "") $('#message').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
return false;
}
});
$('#name, #subject, #email,#message').focus(function(){
$(this).css({"background":"#ffffff","border":"2px solid #e6e6e6"});
});
});
?>
$(document).ready(function() {
$('#buttonsend').click( function() {
var name = $('#name').val();
var subject = $('#subject').val();
var email = $('#email').val();
var message = $('#message').val();
$('.loading').fadeIn('fast');
if (name != "" && subject != "" && email != "" && message != "")
{
$.ajax(
{
url: './sendemail.php',
type: 'POST',
data: "name=" + name + "&subject=" + subject + "&email=" + email + "&message=" + message,
success: function(result)
{
$('.loading').fadeOut('fast');
if(result == "email_error") {
$('#email').css({"border":"2px solid #ffb6b6"}).next('.require').text(' !');
} else {
$('#name, #subject, #email, #message').val("");
$('<div class="success-contact">U bericht is succesvol verstuurd!</div>').insertBefore('#contactFormArea');
$('.success-contact').fadeOut(5000, function(){ $(this).remove(); });
}
}
}
);
return false;
}
else
{
$('.loading').fadeOut('fast');
if( name == "") $('#name').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
if(subject == "") $('#subject').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
if(email == "" ) $('#email').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
if(message == "") $('#message').css({"background":"#FFFCFC","border":"2px solid #ffb6b6"});
return false;
}
});
$('#name, #subject, #email,#message').focus(function(){
$(this).css({"background":"#ffffff","border":"2px solid #e6e6e6"});
});
});
?>
Waar moet ik mijn eigen mail neerzetten zouden jullie dat willen vertellen?
Toevoeging op 14/12/2010 12:34:31:
Code (php)
1
<? tot ?>
Moet weg deed ik alleen maar zodat het er netjes zou staan.
- Wat je zelf postte zet je in contact-form.js (zelfde map als index.php).
- Verder maak je dit
index.php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//NL" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<link rel="shortcut icon" type="image/gif" href="favicon.gif"/>
<meta http-equiv=content-type content="text/html; charset=UTF-8">
<title> contact-form.js </title>
<link rel="stylesheet" type="text/css" href="style.css"/>
<script src="jquery.js"></script>
<script src="contact-form.js"></script>
</head>
<body>
<div id="contactFormArea">
<div> <input id="name"> <label for="name">name</label> </div>
<div> <input id="subject"> <label for="subject">subject</label></div>
<div> <input id="email"> <label for="email">e-mail</label> </div>
<div> <input id="message"> <label for="message">message</label></div>
<div> <input type="button" id="buttonsend" Value="OK"/> </div>
</div>
</body>
</html>
<html>
<head>
<link rel="shortcut icon" type="image/gif" href="favicon.gif"/>
<meta http-equiv=content-type content="text/html; charset=UTF-8">
<title> contact-form.js </title>
<link rel="stylesheet" type="text/css" href="style.css"/>
<script src="jquery.js"></script>
<script src="contact-form.js"></script>
</head>
<body>
<div id="contactFormArea">
<div> <input id="name"> <label for="name">name</label> </div>
<div> <input id="subject"> <label for="subject">subject</label></div>
<div> <input id="email"> <label for="email">e-mail</label> </div>
<div> <input id="message"> <label for="message">message</label></div>
<div> <input type="button" id="buttonsend" Value="OK"/> </div>
</div>
</body>
</html>
sendemail.php
Alles van de mail() zelf regelen, beschermen, ...
Code (php)
Is dat alles wat ik moest doen of moet ik nog wat aanpassen?
Mavalier D op 14/12/2010 14:36:05:
Ik heb een sendemail.php gemaakt, en de code erin gezet met mij email er onder zo dus.
Is dat alles wat ik moest doen of moet ik nog wat aanpassen?
Code (php)
Is dat alles wat ik moest doen of moet ik nog wat aanpassen?
Kijk eens naar het example op php.net, je gebruikt de mail functie fout!
Daar staat meer informatie over de functie mail.
Merk op: als je niet veel ervaring hebt met php kan dit gevaarlijk zijn, zoals vaak het geval is als je met POST data om gaat.