How would i make a contact form like this?
http://habbcrazy.net/#pages/habbcrazy/contact
+rep for help
Ross
Printable View
How would i make a contact form like this?
http://habbcrazy.net/#pages/habbcrazy/contact
+rep for help
Ross
Here's a quickie for you (completely untested):
PHP Code:<?php
$emailTo="[email protected]";
$reasons=array("I have a question","I've spotted a mistake","I would like a job");
if($_POST['submit']!="true"){
$reasonOptions="";
foreach($reasons as $key=>$value){$reasonOptions.="<option value='".($key+1)."'>".htmlentities($value)."</option>";}
echo "<head>\r\n"
."<title>Contact Us</title>\r\n"
."<style>body,td,input,textarea{font-family:arial,sans-serif;color:#777;}.b{font-weight:bold;}.r{text-align:right;}</style>\r\n"
."</head>\r\n"
."<body>\r\n"
."<form method='post'>\r\n"
."<input type='hidden' name='submit' value='true' />\r\n"
."<table>\r\n"
."<tr><td class='b r'>Habbo Name</td><td><input type='text' name='habboname' /></td></tr>\r\n"
."<tr><td class='b r'>Email</td><td><input type='text' name='emailaddress' /></td></tr>\r\n"
."<tr><td class='b r'>Reason</td><td><select name='reason'>{$reasonOptions}</select></td></tr>\r\n"
."<tr><td class='b r'>Message</td><td><textarea name='message'></textarea></td></tr>\r\n"
."<tr><td></td><td><input type='submit' value='Send Message »' /></td></tr>\r\n"
."</table></form>\r\n"
."</body>\r\n";
}else{
// Get input
$habboName=$_POST['habboname'];
$emailAddress=$_POST['emailaddress'];
$reason=$_POST['reason']-1;
$reason=$reasons[$reason];
$message=$_POST['message'];
// Validate input
if($habboName==""||$emailAddress==""||$reason==""||$message=="") die("<b>You left something out...</b><br />Please go back and try again.");
if(!preg_match( "/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/", $emailAddress)) die("<b>Invalid email address...</b><br />Please re-type your email address and try again.");
}
// Send email
$mail=mail($emailTo,"Form Submission ({$reason})","Date: ".date("r (U)")."\r\n\r\nIP Address: {$_SERVER['REMOTE_ADDR']}\r\n\r\nHabbo Name: {$habboName}\r\n\r\nReturn email: {$emailAddress}\r\n\r\nReason: {$reason}\r\n\r\nMessage:\r\n{$message}","From: Your site");
// Success or Error
if($mail) die("<b>Message sent successfully.</b><br />Thank you for contacting us. We hope to reply within 24-48 hours.");
else die("<b>Unable to send email</b><br />Please try again later.");
?>
Nono i think you misunderstood me, what i was trying to do was change the colour of the text box, as Habbcrazy have done :P
Ross
Oh, like...
Code:<head>
<style>
input,textarea
{
border:1px solid #AAA;
border-bottom:2px solid #AAA;
padding:5px;
-moz-border-radius:5px;
border-radius:5px;
}
</style>
</head>
What i was hoping for was having as text box like HabbCrazys but a tad different then having a image in the background of the text box saying Quakal then when they clicked on it the Quakal part disapeared so they could write in it...
Ross
You could just use normal text and javascript...Quote:
Originally Posted by GoldenMerc
Code:<input type='text' value='Quakal' onfocus='if(this.clicked==null){this.clicked=true;this.value="";}' />
Nah i don't think that'd look good enough :P
Quote:
Originally Posted by GoldenMerc
?Code:<input type='text' style='background-image:url(quakal_logo.png);' onfocus='this.style.backgroundImage="";' />
That'd be it :P, Plus now i need to find a classy text box to fit with the logo inside the text box Hmmm
It looks a like like RadiPanel's form. Maybe you should check that out and study the CSS?
My heart skipped a beat when I saw that someone other than myself was using hash tag navigation. My favourite clean URL spin off :P
http://digitalbush.com/projects/watermark-input-plugin/ is my favourite jQuery plugin for the job. It has yet to fail me!