Jump to content

Form validation values reset

caclark

By caclark
in PHP Coding Help

Recommended Posts

caclark Newbie

caclark

Posted
Posted

I have a HTML form that I am currently working on that contains some PHP validations. But I am having some issues with getting my selection buttons to retain their "check" state after a failed validation. This form will ultimately be used mostly on smaller devices so I am using Bootstrap 4 for my HTML formatting, and I am wondering if this is causing some of my issues with my php not being recognized within my form buttons.

 

My form is fairly lengthy at this point so I will attach the full html form, but will only include the sections below that pertain to the validation, and the html form section with the buttons.

 

 

PHP used for validation

<?php
// define variables and set to empty values
$serviceAttendedErr = $serviceAttendedErrClass = $firstNameErr = $firstNameErrClass = $lastNameErr = $lastNameErrClass = $emailErr = $genderErr = $websiteErr = $checkedTermsErr = "";
$name = $email = $gender = $classes = $myDateTime = $course = $checkedTerms = $successMessage = $string_version_serviceAttended = "";
$serviceAttended = [];
//$errors = 0;

if ($_SERVER["REQUEST_METHOD"] == "POST") {

$myDateTime = date('m/d/Y g:i a');
//$errors = $_POST["submit"]; // Resetting this variable for each submit of the form

// making sure someone doesn't just add white spaces into the input field to bypass the validation
$firstName = test_input($_POST["firstName"]);
$lastName = test_input($_POST["lastName"]);

if (!empty($_POST["serviceAttended"])){
	$serviceAttended = $_POST["serviceAttended"];
	//Making a string version of the above array so it can be used for debug on the screen 
	//(want a single line return, not multiple lines like print_r() or var_dump() would return)
	$string_version_serviceAttended = implode(', ', $serviceAttended);
}

// Checking to make sure at least one service button has been chosen, 
// can also specify a particular one is needed as well (see isChecked Function)
	if(isChecked('serviceAttended','')) { 
 		$serviceAttendedErrClass = " alert alert-success";
	} else { 
		$serviceAttendedErr = " <h5>Please Choose At Least One!</h5>";
		$serviceAttendedErrClass = " alert alert-danger";
	} 

// First Name Checks
    if (empty($firstName)){
        $firstNameErr = " (Required!)";
		$firstNameErrClass = " alert alert-danger";
		
//		$errors = 1;
    }else {
        $firstName = test_input($firstName);
		$firstNameErrClass = " alert alert-success";
    }	

// Last Name Checks	
    if (empty($lastName)){
        $lastNameErr = " (Required!)";
		$lastNameErrClass = " alert alert-danger";
		
//		$errors = 1;
    }else {
        $lastName = test_input($lastName);
		$lastNameErrClass = " alert alert-success";
    }	
	
// Email Address Checks	
    if (empty($_POST["email"])) {
        $emailErr = "Email is required";
//		$errors = 1;
    }else {
        $email = test_input($_POST["email"]);
        // check if e-mail address is well-formed
        if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
            $emailErr = "Invalid email format"; 
//			$errors = 1;
        }
    }
    if (empty($_POST["course"])) {
        $course = "";
    }else {
        $course = test_input($_POST["course"]);
    }
    if (empty($_POST["classes"])) {
        $classes = "";
    }else {
        $classes = test_input($_POST["classes"]);
    }
	if (!isset($_POST["gender"])){	
        $genderErr = "Gender is required";
//		$errors = 1;
    }else {
        $gender = test_input($_POST["gender"]);
    }
    if (empty($_POST["subject"])) {
        $subjectErr = "You must select 1 or more";
//		$errors = 1;
    }else {
        $subject = $_POST["subject"];	
    }
	
    if (!isset($_POST["checkedTerms"])){
        $checkedTermsErr = "You must accept the Terms of use";
//		$errors = 1;
    }else {
        $checkedTerms = test_input($_POST["checkedTerms"]);	
    }

//	if($errors == 0){
//		$successMessage ="Form Submitted Successfully..."; // IF no errors
//	}
}

// Function to remove useless info from the inputs
function test_input($data) {
    $data = trim($data);
    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;
}

function isChecked($chkname,$value) { 
	if(!empty($_POST[$chkname]) && !empty($value)) {
		foreach($_POST[$chkname] as $chkval) { 
			if($chkval == $value) { 
				return true; 
			} 
		} 
	}else {
		if(!empty($_POST[$chkname])) {	
			return true; 
		}
	}
	return false; 
}

// Original "isChecked()" function
//function isChecked($chkname,$value) { 
//	if(!empty($_POST[$chkname])) {
//		foreach($_POST[$chkname] as $chkval) { 
//			if($chkval == $value) { 
//				return true; 
//			} 
//		} 
//	} 
//	return false; 
//}


?>

HTML Form with the button sections (only partial form code)

<body>
<div class="container-fluid">

    <div class="row">

        <!-- Use the container for testing screen size only. Remove it later -->
        <div class="container">
            <div class="hidden-lg-down"><span class="badge badge-default">xl</span></div>
            <div class="hidden-md-down hidden-xl-up"><span class="badge badge-default">lg</span></div>
            <div class="hidden-sm-down hidden-lg-up"><span class="badge badge-default">md</span></div>
            <div class="hidden-xs-down hidden-md-up"><span class="badge badge-default">sm</span></div>
            <div class="hidden-xs hidden-sm-up"><span class="badge badge-default">xs</span></div>
        </div>
    </div>

    <div class="row">

        <div class="col-4 offset-4 text-center">
            <h2>Header Text</h2>
        </div>

    </div>

    <form class="form-horizontal" role="form" method = "POST" action = "<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">

        <div class="form-group row">

            <div class="col-12 card card-block requiredIcon <?php echo $serviceAttendedErrClass; ?>">
				<div class = "text-danger offset-5"><?php echo $serviceAttendedErr;?></div>
                <div class="btn-group offset-1" data-toggle="buttons" for="serviceAttended">

                    <label class="form-check-label text-left mx-2">When Did You Attended?</label>
					
                    <label class="col-2 btn btn-secondary btn-responsive not-active">	
                        <input name="serviceAttended[0]" type="checkbox" value="8am" <?php if(isset($_POST['serviceAttended']) && in_array('8am', $_POST['serviceAttended'])) echo 'checked="checked"'; ?> > 8:00 AM
                    </label>
                    <label class="col-2 btn btn-secondary btn-responsive not-active">
                        <input name="serviceAttended[1]" type="checkbox" value="930am" <?php if(isset($_POST['serviceAttended'][1])) echo 'checked="checked"'; ?> > 9:30 AM
                    </label>
                    <label class="col-2 btn btn-secondary btn-responsive not-active">
                        <input name="serviceAttended[2]" type="checkbox" value="11am" <?php if(isset($_POST['serviceAttended']) && in_array('11am', $_POST['serviceAttended'])) echo 'checked="checked"'; ?> > 11:00 AM
                    </label>
                    <label class="col-2 btn btn-secondary btn-responsive not-active">
                        <input name="serviceAttended[3]" type="checkbox" value="other" <?php if(isset($_POST['serviceAttended']) && is_array($_POST['serviceAttended']) && in_array('other', $_POST['serviceAttended'])) echo 'checked="checked"'; ?> > Other
                    </label>
                </div>

            </div>

        </div>

        <div class="row">

            <div class="col-2 card card-block">

                <label class="form-check-label py-2">Button Column</label>

                <div class="btn-group-vertical" data-toggle="buttons" for="inputMemberStatus">


                    <label class=" btn btn-secondary btn-responsive not-active">
                        <input name="inputMemberStatus" id="optionOne" name="optionOne" type="radio"> Option One
                    </label>

                    <label class=" btn btn-secondary btn-responsive not-active">
                        <input name="inputMemberStatus" id="optionTwo" name="optionTwo" type="radio"> Option Two
                    </label>

                    <label class=" btn btn-secondary btn-responsive not-active">
                        <input name="inputMemberStatus" id="optionThree" name="optionThree" type="radio"> Option Three
                    </label>

                    <label class=" btn btn-secondary btn-responsive not-active">
                        <input name="inputMemberStatus" id="optionFour" name="optionFour" type="radio"> Option Four
                    </label>

                    <label class=" btn btn-secondary btn-responsive not-active">
                        <input name="inputMemberStatus" id="optionFive" name="optionFive" type="radio"> Option Five
                    </label>

                </div>

            </div>

            <div class="col-10 card card-block">

                <label class="form-check-label py-2">My Contact Information</label>       

                <div class="form-group row" id="userNameInfo">

                    <div class="col-md-6">
                        <input class="form-control <?php echo $firstNameErrClass; ?>" id="firstName" name="firstName" type="text" placeholder="First Name <?php echo $firstNameErr;?>" <?php if (!empty($_POST['firstName'])) {echo "value=\"" . $firstName . "\"";} ?> required="required">
<!--							<div class = "text-danger">* <?php echo $firstNameErr;?></div> -->
                    </div>
                    <div class="col-md-6">
                        <input class="form-control <?php echo $lastNameErrClass; ?>" id="lastName" name="lastName" type="text" placeholder="Last Name <?php echo $lastNameErr;?>" <?php if (!empty($_POST['lastName'])) {echo "value=\"" . $lastName . "\"";} ?> required="required">
<!--							<div class = "text-danger">* <?php echo $lastNameErr;?></div> -->
                    </div>

                </div>

As you can see in the above form (input name="serviceAttended[]" form group row) I have tried several variations of the in-line php set to check the array and then echo the "checked" tag to the input if it passes the logic. I think these all seem to be valid "if" statements, but I still can't get any of them to work as they should after the submit validation. Anyone ran into a similar issue? If so how did you fix it?

 

 

Please Note:

 

  • For my sanity later (not part of the code yet), I do need to keep all of the button groups with the same arrayed names so I can pass these groups into a database.
  • I have not completed any of my php validations so far past line 310 of the attached file (aka working my way down the form with my validations).

 

 

 

 

Address Form.html

Link to comment
Share on other sites
Psycho Prolific Member

Psycho

Posted
Posted

First, it is helpful to use the correct terminology. You stated you were having a problem with your "selection buttons". I thought you were talking about <select> lists which is a common problem people have in making them 'sticky' when there are validation errors. It seems you are referring to checkboxes.

 

Your code is a bit over-complicated. When you have to repeat logic (even if it is just to make a field 'sticky') you need to consider creating a common process/code to achieve those results instead of copy/pasting the same code.

 

The validation logic doesn't even seem to do anything. It creates a bunch of random error variables, but doesn't do anything with them. I see you had defined an array to hold errors, but then commented it out. Why? That is a much better solution than creating individual error variables.

 

I can't really tell when the problem is because I can't verify what is happening after the form is submitted and the validation logic is executed. How are you re-displaying the form? Is it in the same page, is it included, or do you use a header redirect? This field looks like it should work

<input name="serviceAttended[0]" type="checkbox" value="8am" <?php if(isset($_POST['serviceAttended']) && in_array('8am', $_POST['serviceAttended'])) echo 'checked="checked"'; ?> > 8:00 AM

If it is not, then there is something going on that is not retaining the POST values.

 

Plus, there is a LOT of bad code. There is no reason to use stripslashes() and htmlspecialchars() should only be used on the data before it is output to the page. You would NOT run that on the value before saving it (to a database presumably). The values for time should be a valid "time" format (e.g. "08:00:00") so it will be handled in the code correctly if you need to use it as a time value.

 

To put it bluntly, the code is a mess. Let me provide an example in a bit

Link to comment
Share on other sites
Psycho Prolific Member

Psycho

Posted
Posted

Alright, I'd probably do several things differently, but I didn't want to spend a lot of time on this. Here is a working example with the code in a much more logical format. Rather than copy/pasting the same thing multiple times - the code to generate and validate the checkboxes and radio buttons work by using two arrays. You can add/edit the list of options by modifying the arrays only.

 

 

<?php
 
//Create array of attend times
$attendTimes = array(
    '08:00:00' => '8:00 AM',
    '09:30:00' => '9:30 AM',
    '11:00:00' => '11:00 AM',
    'Other' => 'Other'
);
//Create array of member statuses
$meberStatuses = array(
    1 => 'Option One',
    2 => 'Option Two',
    3 => 'Option Three',
    4 => 'Option Four',
    5 => 'Option Five'
);
 
//Set variables for success/error classes
$successClass = 'alert alert-success';
$errorClass   = 'alert alert-danger';
 
//??Create valiable to hold errors
$errors = array();
 
//Set values of form fields from POST data (if exists)
$firstName = isset($_POST["firstName"]) ? trim($_POST["firstName"]) : '';
$errors['firstName'] = '';
$lastName = isset($_POST["lastName"]) ? trim($_POST["lastName"]) : '';
$errors['lastName'] = '';
$errors['serviceAttended'] = '';
$status = isset($_POST["memberStatus"]) ? trim($_POST["memberStatus"]) : '';
$errors['memberStatus'] = '';
 
if ($_SERVER["REQUEST_METHOD"] == "POST")
{
    //Set defaults then validate first name
    
    $firstNameClass = $successClass;
    if($firstName=='')
    {
        $errors['firstName'] = "* (Required!)";
        $firstNameClass = $errorClass;
    }
    //Set defaults then validate last name
    $lastNameClass = $successClass;
    if($lastName=='')
    {
        $errors['lastName'] = "* (Required!)";
        $lastNameClass = $errorClass;
    }
    //Filter out any attend values that are not valid
    $serviceAttended = array_intersect($_POST['serviceAttended'], $attendTimes);
    //Validate at least one attend time checkbox is checked
    if(!count($serviceAttended))
    {
        $errors['serviceAttended'] = "<h5>Please Choose At Least One!</h5>";
        $attendTimeClass = $errorClass;
    }
    //Verify a valid status was selected
    if(!in_array($status, array_keys($meberStatuses)))
    {
        $errors['memberStatus'] = "<h5>Please Choose At Least One!</h5>";
    }
    
    //Check if there were any errors
    if(count($errors))
    {
        //There was at least one error - add error handler and redisplay form
    }
    else
    {
        //Add data is valid - process it and redirect to success page
    }
}
 
//Create fields for attend times
$attendCheckboxes = '';
foreach($attendTimes as $value => $label)
{
    $checked = (isset($_POST['serviceAttended']) && in_array($value, $_POST['serviceAttended'])) ? ' checked="checked"' : '';
    $attendCheckboxes .= "<label class='col-2 btn btn-secondary btn-responsive not-active'>\n";
    $attendCheckboxes .= "<input name='serviceAttended[]' type='checkbox' value='{$value}' {$checked}> {$label}\n";
    $attendCheckboxes .= "</label>\n";
}
//Create member status fields
$memberButtons = '';
foreach($meberStatuses as $value => $label)
{
    $checked = (isset($_POST['memberStatus']) && $_POST['memberStatus']==$value) ? ' checked="checked"' : '';
    $memberButtons .= "<label class='btn btn-secondary btn-responsive not-active'>\n";
    $memberButtons .= "<input name='memberStatus' id='option_{$value}' name='option_{$value}' type='radio' value='{$value}'{$checked}> {$label}\n";
    $memberButtons .= "</label>\n";
}
 
?>
<html>
 
<body>
<div class="container-fluid">
 
    <div class="row">
 
        <!-- Use the container for testing screen size only. Remove it later -->
        <div class="container">
            <div class="hidden-lg-down"><span class="badge badge-default">xl</span></div>
            <div class="hidden-md-down hidden-xl-up"><span class="badge badge-default">lg</span></div>
            <div class="hidden-sm-down hidden-lg-up"><span class="badge badge-default">md</span></div>
            <div class="hidden-xs-down hidden-md-up"><span class="badge badge-default">sm</span></div>
            <div class="hidden-xs hidden-sm-up"><span class="badge badge-default">xs</span></div>
        </div>
    </div>
 
    <div class="row"><div class="col-4 offset-4 text-center"><h2>Header Text</h2></div></div>
 
    <form class="form-horizontal" role="form" method = "POST" action = "">
 
        <div class="form-group row">
            <div class="col-12 card card-block requiredIcon <?=$attendTimeClass;?>">
<div class = "text-danger offset-5"><?=$errors['serviceAttended'];?></div>
                <div class="btn-group offset-1" data-toggle="buttons" for="serviceAttended">
                    <label class="form-check-label text-left mx-2">When Did You Attended?</label>
                    <?=$attendCheckboxes?>
                </div>
            </div>
        </div>
 
        <div class="row">
            <div class="col-2 card card-block">
                <label class="form-check-label py-2">Button Column</label>
                <div class = "text-danger offset-5"><?=$errors['memberStatus'];?></div>
                <div class="btn-group-vertical" data-toggle="buttons" for="inputMemberStatus">
                    <?=$memberButtons?>
                </div>
 
            </div>
 
            <div class="col-10 card card-block">
                <label class="form-check-label py-2">My Contact Information</label>       
                <div class="form-group row" id="userNameInfo">
                    <div class="col-md-6">
                        <input class="form-control <?=$firstNameClass?>" id="firstName" name="firstName" type="text" placeholder="First Name" value="<?=$firstName;?>" required="required">
<div class = "text-danger"><?php echo $errors['firstName']; ?></div>
                    </div>
                    <div class="col-md-6">
                        <input class="form-control <?=$lastNameClass?>" id="lastName" name="lastName" type="text" placeholder="Last Name" value="<?=$lastName;?>" required="required">
<div class = "text-danger"><?php echo $errors['lastName']; ?></div>
                    </div>
                </div>
            </div>
            
        </div>
        <button type="submit">Submit</button>
    </form>
</body>
</html>
Link to comment
Share on other sites

Archived

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

Go to topic listing
×
×
  • Create New...

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.