[SOLVED] Form Checkbox Validation

[Stuart]

Hey guys,
I have a form on my website that contains three checkboxes. One of the checkboxes is called "other" and has a text field next to it where the user specifies other. Here is a visual:

HTML: Select all

[]Other, specify:[textbox]

The form works, I just can't get the php to display an error when the checkbox is checked but the text field is empty.
I have this so far:

PHP: Select all

if(isset($chckbx) || empty($txtbx)) {
echo 'You selected "other", please specify!'
}


// ("chckbx" is the name of the checkbox, "txtbx" is the name of the text field) 

I do not think this is correct. I am trying to tell the php: "if chckbx is checked but txtbx is empty, display error".
Any suggestions?

Thanks,
SWagner

[Rakuli]

You nearly got it you just have to say AND instead of OR

PHP: Select all

if(isset($chckbx) && empty($txtbx)) 

{echo 'You selected "other", please specify!'}



// ("chckbx" is the name of the checkbox, "txtbx" is the name of the text field) 

[Stuart]

Thanks! I had that in the back of my head, I just didn't remember it at the time...
Now, I also have a bit of an opinion question: What should I say for the error (the one in my script is just an example)? I remember a thread by Alex about client-personnel etiquette and I wondered how I would phrase a friendly pointer to fill in the textbox if the checkbox is checked. I have this: You have selected "Other". Please specify
But I don't like it since I use quotes for the name of the checkbox. Maybe something like "You have selected other but you forgot to fill in the specification." Any suggestions?

[Rakuli]

It depends on the context of the form really.. If it's a professional site something like

"Please specify what shoes you wear" or whatever the actual form is for... Also try to make sure it is obvious that they have to add something -- change the background colour of the text box when they choose that checkbox for example...

Most polite explanations are fine just don't say something like

"You silly nong, I can't believe you forgot to specify something -- perhapds you should go back to school for a while and then come and try out this form" --- that may intimidate some people

[Eran]

i kinda like this phrase :]

error - pleae fill in the Other text

[Stuart]

Thanks for the suggestions.

Originally Posted by Rakuli

Also try to make sure it is obvious that they have to add something -- change the background colour of the text box when they choose that checkbox for example...

That is the goal. I am working on it right now. The idea is that when an error occurs, the text field label turns bold and red. Like this:

No error
Label: [textbox]

Error
Label: [textbox]

That will make it obvious to the user what field contains the error.

[Stuart]

OK. Hold on... How do I make the php do what I mentioned in that last post? Do I have to generate the content from the beginning on? So, php echo the form? I have no clue... I've never done something like this before! Don't get frustrated with me...

[AdRock]

I have done this....gimme a while and i'll dig out the code

[AdRock]

Right...you need to do some sort of validation checking for empty fields etc

check if the field is empty....or wahetever you want

PHP: Select all

if(empty($first_name)) { 
        $error['first_name'] = true;
} 

you need this in your form in your label.....mine is the input field that changes color

PHP: Select all

<p><label for="first_name">Forename:</label>
        <input type="text" <?php error_bool($error, "first_name"); ?> title="Please enter your first name" id="first_name" name="first_name" size="30" value="<?php echo $first_name; ?>" /></p>

the function that changes the color of the field/label

PHP: Select all

function error_bool($error, $field) { 
    if($error[$field]) { 
    print("style=\"background-color:#FBEC87\""); 
    } 
    else {
    print("style=\"background-color:white\"");
    }
} 

[Stuart]

Hmm, doesn't seem to work for me... Take a look at my form: (* denotes a required field)

HTML: Select all

<form method="post" action="webmaster2.php" name="wbmstr" enctype="multipart/form-data">
Name: <input type="text" name="name" size="35" value="" />
* Email: <input type="text" name="email" size="35" value="" />
* Message Type:
<input type="radio" name="type" id="type1" value="problem" checked="checked" /> Problem
<input type="checkbox" name="problem1" id="prblm1" value="text" /> Text
<input type="checkbox" name="problem2" id="prblm2" value="images" /> Images
<input type="checkbox" name="problem3" id="prblm3" value="other:" /> Other: <input type="text" name="other" value="" />
<input type="radio" name="type" id="type2" value="comment/question" /> Comment or Question
<input type="radio" name="type" id="type3" value="suggestion" /> Suggestion
URL: <input type="text" name="url" id="url" size="45" value="http://" />
* Message: <textarea name="message" rows="10" cols="45"></textarea>
<input type="submit" value="submit" class="button" />
</form>

Take a look at it here. Now, I think I used your code wrong, so I took it out again.

Edit: Added asterisks to show required fields.

[AdRock]

you need to check the validation and if it fails redisplay the form

[AdRock]

Originally Posted by swagner

Hmm, doesn't seem to work for me... Take a look at my form:

HTML: Select all

<form method="post" action="webmaster2.php" name="wbmstr" enctype="multipart/form-data">
Name: <input type="text" name="name" size="35" value="" />
Email: <input type="text" name="email" size="35" value="" />
Message Type:
<input type="radio" name="type" id="type1" value="problem" checked="checked" /> Problem
<input type="checkbox" name="problem1" id="prblm1" value="text" /> Text
<input type="checkbox" name="problem2" id="prblm2" value="images" /> Images
<input type="checkbox" name="problem3" id="prblm3" value="other:" /> Other: <input type="text" name="other" value="" />
<input type="radio" name="type" id="type2" value="comment/question" /> Comment or Question
<input type="radio" name="type" id="type3" value="suggestion" /> Suggestion
URL: <input type="text" name="url" id="url" size="45" value="http://" />
Message: <textarea name="message" rows="10" cols="45"></textarea>
<input type="submit" value="submit" class="button" />
</form>

Take a look at it here. Now, I think I used your code wrong, so I took it out again.

Which of these fields do you want validating so if validation fails, the label changes color.

What i have done with my form is change th ecolor of the input fields but if you have checkboxes that need validating, you're better off doing the label.

If you let me know what needs to be validated, i'll have a go at your form for you

[Stuart]

Well, just as a side info, the form's purpose is a webmaster contact form. It allows users to contact me (the webmaster) through a form. They can report a problem, comment on something, ask a question, or make a suggestion by choosing a radio button. So, that part is required. The email field is also required, as well as the message field. I put asterisks into my code above to show which fields are required and should change color.

[AdRock]

So you want the email, message and if they have selected problem and not ticked any boxes

[Stuart]

Yup. Actually, why don't I just give you the link to the actual page (webmaster.php) where php validation already works through an external file (webmaster.process.php). Go there
Maybe that will clear things up.

[Rakuli]

You're on a different page when you're validating so you'll have to use the $_SESSION

In the validting php script place

<?php session_start(); ?>

At the very top and then for each field that is required and doesn't validat do something like

PHP: Select all

if ($thisFields == 'It\'s all wrong')

    $_SESSION['thisFieldName'] = true;

else 

    $_SESSION['thisFieldName'] = false; // so it doesn't stay true for later 

Then on your actual form, add the session start at the top again...

When you get into the form do something like

PHP: Select all

Name: <input type="text" name="name" size="35" value="" <?php echo isset($_SESSION['name']) && $_SESSION['name'] ? 'style="background-color: pink" : '';?> />

Email: <input type="text" name="email" size="35" value="" <?php echo isset($_SESSION['name']) && $_SESSION['email'] ? 'style="background-color: pink" : '';?> />

This is how you can do it because your form isn't recursive, it is being processed by a different script.

Hope that helps,

[Stuart]

Well, it does not need to be processed by a different script. I would prefer it not to be, actually. I want to place the validation script right into the page with the form, and when the form is successfully submitted, the form is replaced by a message telling the user that there were no errors.

[Rakuli]

You could do this easily by pointing the forms action at the same file and putting something like

PHP: Select all

<?php



if (isset($_POST['submitButton']))

{

       // process form details here because the submit button was clicked

      // Add each error to the errors array .. $errors['name'] = true;

} 



if (!count($errors))

{

    // display the success message here

} else if (!isset($_POST['submitButton']) || count($errors)) {

// Check if submit button is not been set, or if it has, if there were any errors

?>



<!-- put the form html etc in here and instead of using $_SESSION as in my above post, use the $errors array to change the bg colour if required //-->



<?php

}

?>

[Stuart]

Woah! Look:

Code: Select all

Error: Parse error:  syntax error, unexpected T_IF in /opt/www/courses2-port80/wagnerlab/webmaster2.php on line 74

Line 74 is this:

PHP: Select all

<label <?php echo if ($errors['email'] = true;){echo 'style="color:red;"';}?>>* Email:</label><input type="text" name="email" size="35" value="">

I'm sure I used the php wrong... That's what I gathered from your script.

[Rakuli]

This is wrong

PHP: Select all

<?php echo if ($errors['email'] = true;){echo 'style="color:red;"';}?>>

don't use the whole if/else thing here, use the inline ternary operator..

PHP: Select all

<?php echo isset($errors['email']) && $errors['email'] === true ? 'style="color: red"' : ''; ?>