Page 1 of 1
Accessibility problem with PHP mail form
Posted: Wed May 19, 2004 10:47 am
by Dirk Diggler
Hi
I've built a site to be accessibile, the problem is the
"value" atribute in the form is a requirement of the WCAG level 3. An example can be found here
Bobby
The problem is because the value attribute contains php
value="<? echo $_POST['name']; ?>" /> . I can't use it for it's accessibility purpose.
This is the code from the php form which can be seen on
my site.
I need the
"value" atribute to contain
"your email address" for example!
<form name="email" action="<? echo $_SERVER['PHP_SELF']; ?>" method="post">
<p><label for="name">name</label><br />
<input class="inputbx" tabindex="1" type="text" name="name" id="name"
value="<? echo $_POST['name']; ?>" />
<br />
<label for="email">your email address</label><br />
<input class="inputbx" tabindex="2" type="text" name="email" id="email"
value="<? echo $_POST['email']; ?>" />
<br />
<label for="subject">subject</label><br />
<input class="inputbx" tabindex="3" type="text" name="subject" id="subject"
value="<? echo $_POST['subject']; ?>" />
<br />
<label for="message">message</label><br />
<textarea tabindex="4" cols="50" rows="10" name="message" id="message"><? echo $_POST['message']; ?></textarea><br /><br />
<input type="submit" tabindex="5" class="inputbtn" name="submit" value="SEND" />
<input type="reset" tabindex="6" class="inputbtn" value="RESET" />
</p>
</form>
This is a screen-shot of how I would like the fixed form to look
Any help would be greatly apprecicated.
Note: I'm a php novice!
Thanks

Posted: Wed May 19, 2004 11:23 am
by feyd
unless you're providing a validation backend to the form, I don't see much use to having those echo's apart of the html there. Just use the example/default text as you wrote in your image.
If you are providing some validation, and want to populate the values with the data passed until the form is correct. I'd suggest creating an array of the default values. Then load from a session (if the processing is external to this script) the fields they entered, and potentially error information. If the processing is done on that page, which it looks like is, then you don't need sessions, just fill the data array with the posted values and provide errors as needed.
Posted: Wed May 19, 2004 11:23 am
by leenoble_uk
Using the short if then syntax:
Code: Select all
<input name="name" value="<?php echo isset($_POST['name'])?htmlentites($_POST['name'],ENT_QUOTES):"Your Name Here"; ?>">
You'll probably want some javascript in the input tag too which will clear the field when it gets focus and refill it with "Your Name Here" if it is left empty when it loses focus.
?>
Posted: Wed May 19, 2004 12:11 pm
by jason
Note: It might also be good to have it so that if the person focuses on the input area, JavaScript will delete the contents of the input area IF the value is the same as the same. That way the person doesn't have to manually erase it.
Remember, being accessible and being usable means you should design for people that have good vision, full motor control, and know what they are doing as much as you should design for people without those capabilities.
Posted: Wed May 19, 2004 4:15 pm
by Dirk Diggler
leenoble_uk wrote:Using the short if then syntax:
Code: Select all
<input name="name" value="<?php echo isset($_POST['name'])?htmlentites($_POST['name'],ENT_QUOTES):"Your Name Here"; ?>">
You'll probably want some javascript in the input tag too which will clear the field when it gets focus and refill it with "Your Name Here" if it is left empty when it loses focus.
?>
Hi
I tried this php, but I got errors! The form won't proccess for validation. I Know very little about php. Any I deas as to why it won't work?
thanks
Posted: Wed May 19, 2004 4:20 pm
by leenoble_uk
could just be my spelling error.
It should read htmlentities not htmlentites
Posted: Wed May 19, 2004 5:27 pm
by Dirk Diggler
Thanks leenoble_uk That did the trick.
The problem I have now is with my form validation!
If a user clicks 'send' without entering their info in the textfields, the returned errors is for the 'your email' field. This is because it fails the email syntax validation check. The other fields pass as they need any text to validate.
I'll try and find the php that validates the form and post it here so you can see it. Maybe by including an 'if' statement to check for the strings of 'value' text
?
Posted: Wed May 19, 2004 5:31 pm
by tim
you can use empty() to vaildate.
if(empty($_POST['name'])) {
echo "error, fill in name";
}
etc
and in code snipplets you can use a regEx to vaildate email (it will only validate the 'syntax' not actually validate if its a true email address to someone.
Posted: Wed May 19, 2004 8:58 pm
by Dirk Diggler
Right, I've sorted all but one small problem. I need to achieve the same effect for the <textarea> that I have for my <input> fields. The onblur and onfocus events work for the <textarea> But when the page loads the <textarea> has no value.
See the form in action on my site.
I need a snippet of javaScript to give the <textarea> a value on page load. I tried this but to no avail;
onload="if(this.value=='')this.value=' your message here';"
Any ideas how to fix this?
This is the code for my form now;
<form name="email" action="<? echo $_SERVER['PHP_SELF']; ?>" method="post">
<p><label for="name">name</label><br />
<input name="name" id="name" class="inputbx" tabindex="1" title=" your name here" onfocus="if(this.value==' your name here')this.value='';" onblur="if(this.value=='')this.value=' your name here';" value="<?php echo isset($_POST['name'])?htmlentities($_POST['name'],ENT_QUOTES):" your name here"; ?>" size="30" /><br />
<label for="email">email address</label><br />
<input name="email" id="email" class="inputbx" tabindex="2" title=" your email here" onfocus="if(this.value==' your email here')this.value='';" onblur="if(this.value=='')this.value=' your email here';" value="<?php echo isset($_POST['email'])?htmlentities($_POST['email'],ENT_QUOTES):" your email here"; ?>" size="30" /><br />
<label for="subject">subject</label><br />
<input name="subject" id="subject" class="inputbx" tabindex="3" title=" message subject here" onfocus="if(this.value==' message subject here')this.value='';" onblur="if(this.value=='')this.value=' message subject here';" value="<?php echo isset($_POST['subject'])?htmlentities($_POST['subject'],ENT_QUOTES):" message subject here"; ?>" size="30" /><br />
<label for="message">message</label><br />
<textarea tabindex="4" cols="50" rows="10" name="message" id="message" title=" your message here" onfocus="if(this.value==' your message here')this.value='';" onblur="if(this.value=='')this.value=' your message here';"><? echo $_POST['message']; ?></textarea><br /><br />
<input type="submit" tabindex="5" class="inputbtn" name="submit" value="SEND" />
<input type="reset" tabindex="6" class="inputbtn" name="reset" value="RESET" />
</p>
</form>
Hope someone can help
thanks
Posted: Wed May 19, 2004 9:02 pm
by tim
maybe i am confused to what it is you want, but you can apply the same process to validate to see if there is a value for a textarea seeing you gave it a name (name=message)
Code: Select all
if ($message == "") { //you can also use the empty() function, again
echo "fill in a msg";
}
?

?
Posted: Wed May 19, 2004 9:30 pm
by Dirk Diggler
Validation is sorted now. All I need to do is give the <textarea> a value when the page loads. Just like the input fields do.
thanks
Posted: Thu May 20, 2004 2:07 am
by leenoble_uk
Textareas aren't filled using the value property.
Code: Select all
<textarea name="textarea" cols="40" rows="10"><?php echo isset($_POST['textarea'])?htmlentities($_POST['textarea'],ENT_QUOTES):"Type some text here";?></textarea>
To be honest I'm not sure how you use javascript to set the text in a textarea field at the client end but that's a JS issue.
Posted: Fri May 21, 2004 11:15 pm
by Dirk Diggler
Thanks for your help leenoble_uk
It's working as intended now. Take a look.