Jump to content

Archived

This topic is now archived and is closed to further replies.

mads

Improving form usability

Recommended Posts

Aloha,

I have created a simple tell a friend form. If the user click send without filling out all of the required fields, I show an error message and the form once more. My problem is that the contents of the form get cleared when I reload the form :(

I would of course like to keep the contents, so the user doesn't get annoyed and leave my website without telling their friends. How do I keep the contents?

Here is the complete (sigh...) code for my form:
------------------------------------------------------------------------
Please fill out this form and click send.

<?php
unset($message_sendername);
unset($message_sender);
unset($message_recipient);
unset($message_subject);
unset($message_text);

  // Get the image text and title
  $message_sendername = $_POST["message_sendername"];
  $message_sender = $_POST["message_sender"];
  $message_recipient = $_POST["message_recipient"];
  $message_subject = $_POST["message_subject"];
  $message_text = $_POST["message_text"];

// Validation
if($_POST["action"] == "Send")
{
if(empty($message_sendername) == true || empty($message_sender) == true)
{
$error["message_sender"] = "Please write your own name or your own e-mail address.";
}

if(empty($message_recipient) == true)
{
$error["message_recipient"] = "Please write your friend's e-mail address.";
}

if(empty($error) == false)
{
unset($_POST["action"]);
}
}

if($_POST["action"] == "Send")
{
$headers  = "From: \"$message_sendername\"<$message_sender>\n";

// Send the e-mail
mail($message_recipient, $message_subject, $message_text, $headers);

print("<p>Your message has been sent to $message_recipient.<br/><br/><a href='/tell-a-friend'>Send another message</a></p>");
}
else
{
// Show errors - if any
if(is_array($error))
{
print("Something went wrong:<br/><font color='#FF0000'>");
while(list($key, $val) = each($error))
{
print("$val");
print("<br>\n");
}
print("</font>");
}
?>
<table>
<tr><td width="10%"></td><td width="80%">
<form method="POST" enctype="multipart/form-data" name="tell_a_friend_form" action="<?$_SERVER["PHP_SELF"];?>" >
<p>Your name:
<input type="text" name="message_sendername" size="60" maxlength="60"></p>
<p>Your e-mail address:
<input type="text" name="message_sender" size="60" maxlength="60"></p>
<p>Friend's e-mail address:
<input type="text" name="message_recipient" size="60" maxlength="60"></p>
<p>E-mail subject:
<input type="text" name="message_subject" size="60" maxlength="60"></p>
<p>E-mail text:
<textarea name="message_text" rows="10" cols="45"></textarea></p>
<p><input type="submit" value="Send" name="action"></p>
</form>
</td><td width="10%"></td>
</tr>
</table>
<?php
}
?>
------------------------------------------------------------------------

Thank you, Mads

Share this post


Link to post
Share on other sites
in the fields put like

[code]
value='<?=$fieldname?>'
[/code]

which would echo off the data into the input text box and textarea

Share this post


Link to post
Share on other sites
Thank you for your reply.

Works great for the text inputs, but the textarea behaves a little bit crazy. It shows the HTML tags when the page reloads...?

Check it out here:
http://www.horseornot.com/tell-a-friend/

(Just forget to fill out one of the e-mail address fields in order to see the effect)

Share this post


Link to post
Share on other sites
Didn't help :(
<textarea name="message_text" rows="10" cols="45"><?=html_entity_decode($message_text);?></textarea></p>

Share this post


Link to post
Share on other sites
You shouldn't use that approach since it requires short tags on in php.ini. Instead you should use: [code]<?php echo html_entity_decode($message_text); ?>[/code]

Share this post


Link to post
Share on other sites
Still doesn't work :(

<textarea name="message_text" rows="10" cols="45"><?php echo html_entity_decode($message_text); ?></textarea></p>

Share this post


Link to post
Share on other sites
Try this: [code]<?php
echo <<<EOF
<style type='text/css'>
body, table {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
}
#message {
margin-bottom: 1em;
}

#error {
color: red;
font-weight: bold;
}
</style>

EOF;

function show_form($message=null,$errors=array())
{
foreach($_POST as $key => $value)
{
$_POST[$key] = htmlentities($value);
}

$message = !empty($message) ? "\n\t<div id='message'>{$message}</div>" : null;

if(count($errors))
{
$num_errors = count($errors);

$error = <<<EOF

<div id='error'>Please correct the following errors (total: {$num_errors}):</div>
<ul>
<li>
EOF;
$error .= join("</li>\n\t\t<li>",$errors);
$error .= "</li>\n\t</ul>";
}

echo <<<EOF
<form method='post' name='tell_a_friend_form' action=''>{$message}{$error}
<table>
<tr>
<td valign='top'><label for='sender_name'>Your name:</label></td>
<td><input type='text' name='sender_name' id='sender_name' size='45' value='{$_POST['sender_name']}' /></td>
</tr>
<tr>
<td valign='top'><label for='sender_email'>Your email:</label></td>
<td><input type='text' name='sender_email' id='sender_email' size='45' value='{$_POST['sender_email']}' /></td>
</tr>
<tr>
<td valign='top'><label for='recipient'>Your friend's email:</label></td>
<td><input type='text' name='recipient' id='recipient' size='45' value='{$_POST['recipient']}' /></td>
</tr>
<tr>
<td valign='top'><label for='subject'>Subject:</label></td>
<td><input type='text' name='subject' id='subject' size='45' value='{$_POST['subject']}' /></td>
</tr>
<tr>
<td valign='top'><label for='message'>Message:</label></td>
<td><textarea name='message' id='message' rows='10' cols='45'>{$_POST['message']}</textarea></td>
</tr>
<tr>
<td colspan='2'><button type='submit'>Send</button></td>
</tr>
</table>
</form>
EOF;
}

if(count($_POST))
{
$errors = array();

if(empty($_POST['sender_name']))
{
$errors[] = "Please write your name."; 
}

if(empty($_POST['sender_email']))
{
$errors[] = "Please enter your email.";
}

if(empty($_POST['recipient']))
{
$errors[] = "Please write your friend's e-mail address."; 
}

if(empty($_POST['subject']))
{
$errors[] = "Please enter a subject.";
}

if(empty($_POST['message']))
{
$errors[] = "Please enter a message.";
}

if(count($errors) < 1)
{
$headers = "From: {$_POST['sender_name']} <{$_POST['sender_email']}>\n\r";

if(@mail($_POST['recipient'],$_POST['subject'],$_POST['message'],$headers))
{
show_form("Your message has been sent.");
}
else {
show_form("Your message could not be sent! Please try again.");
}
}
else {
show_form(null,$errors);
}
}
else {
show_form();
}
?>[/code]

Share this post


Link to post
Share on other sites
Still no luck - sad to report that the long piece of code doesn't improve things.

I have moved some of the things outside the textarea. It looks like "html_entity_decode($message_text);" do what it is supposed to do, so the problem is caused by the textarea.

Share this post


Link to post
Share on other sites
Are you sure it doesn't work? It works on my computer: Linux, Apache 2.0.55, PHP 5.1.2, Firefox 1.5.0.7

[URL=http://img222.imageshack.us/my.php?image=screenshot13rj8.png][IMG]http://img222.imageshack.us/img222/9379/screenshot13rj8.th.png[/img][/URL]

Share this post


Link to post
Share on other sites
Yes, it is running your script right now (http://www.horseornot.com/tell-a-friend/)

I noticed that you haven't got any line breaks in your screenshots. Does it still work if you add some line breaks?

Maybe it's worth mentioning that my script runs inside a page created by Wordpress.

Share this post


Link to post
Share on other sites
It works for me:
[URL=http://img222.imageshack.us/my.php?image=screenshot14jl5.png][IMG]http://img222.imageshack.us/img222/2978/screenshot14jl5.th.png[/img][/URL]

It must be your computer/browser. Try using another browser.

[quote author=mads link=topic=111599.msg452559#msg452559 date=1161002252]I noticed that you haven't got any line breaks in your screenshots. Does it still work if you add some line breaks?[/quote]

It do not need like breaks :) (if it is the html line breaks ([tt][nobbc]<br />[/nobbc][/tt]) you talk about)

Share this post


Link to post
Share on other sites
Same thing in Explorer... I will try on my computer at home later today.

Thanks for your help.

Share this post


Link to post
Share on other sites
Daniel0 your code works lovly and is a good bit of code well designed.

I think that your email system dosent work mads cheak you php.ini for the mail settings ok.

Share this post


Link to post
Share on other sites
But this is just form stuff - it happens long before we attempt to do any mail stuff.

Share this post


Link to post
Share on other sites
It also doesn't work on my machine at home, but I have discovered something: The script works perfectly if I put it in a seperate file and upload it.

Both Daniel0's (http://www.horseornot.com/abe1.php) and my script (http://www.horseornot.com/abe2.php) work if I put them in seperate files (although Daniel0's script look far better when it's placed in a seperate file...).

Guess the conclusion is that Wordpress affect how my textarea behaves, so I will move to the wordpress forum and annoy people there  :P
http://wordpress.org/support/topic/90903?replies=1

Thank you for all your help.

Share this post


Link to post
Share on other sites

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.