Ask your WordPress questions! Pay money and get answers fast! (more info)

How to make a custom profile input field "required". WordPress

  • SOLVED

Having created some custom input fields (input & select boxes) that are located in the backend customer profile area I would like to make some of these fields required (mandatory selections)...

If the field has not been completed and the user attempts to save their profile I would like the standard wordpress error messaging to appear at the top of the screen notifying the user... The same error that is thrown for not having an email address i.e ERROR: Please enter an e-mail address.

I also want to ensure that the selectbox dropdown <option value="">- Select Years Of Experience -</option> is not treated as a selectable option...

My current code that works without required fields is such;

add_action( 'show_user_profile', 'my_show_extra_profile_fields' );
add_action( 'edit_user_profile', 'my_show_extra_profile_fields' );

function my_show_extra_profile_fields($user) {?>

<h3>Extra Profile Information</h3>

<?php if($user->has_cap('administrator')) { // Custom field only display to administrator?>

<table class="form-table">

<tr>

<th><label for="age">Age</label></th>

<td><input type="text" name="age" id="age" value="<?php echo esc_attr(get_the_author_meta( 'age', $user->ID ) ); ?>" class="regular-text" />

<br />

<span class="description">Please enter your age.</span> </td>

</tr>

</table>

<?php } if($user->has_cap('subscriber')) {// Custom field only display to subscriber ?>

<table class="form-table">

<tr>
<th><label for="dropdown">Years Of Experience</label></th>
<td>
<?php
//get dropdown saved value
$selected = get_the_author_meta( 'exp_years', $user->ID );
?>
<select name="exp_years" id="exp_years" style="width:100%;">
<option value="">- Select Years Of Experience -</option>
<option value="value1" <?php echo ($selected == "value1")? 'selected="selected"' : '' ?>>Less than 1 year</option>
<option value="value2" <?php echo ($selected == "value2")? 'selected="selected"' : '' ?>>1-3 years</option>
<option value="value3" <?php echo ($selected == "value3")? 'selected="selected"' : '' ?>>4-7 years</option>
<option value="value4" <?php echo ($selected == "value4")? 'selected="selected"' : '' ?>>8-15 years</option>
<option value="value5" <?php echo ($selected == "value5")? 'selected="selected"' : '' ?>>15+ years</option>
</select>

<span class="description">Years of experience.</span>
</td>
</tr>

</table>

<?php } }

add_action( 'personal_options_update', 'my_save_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'my_save_extra_profile_fields' );

function my_save_extra_profile_fields( $user_id ) {

if ( !current_user_can( 'edit_user', $user_id ) )

return false;

if(!empty( $_POST['age'])){

update_usermeta( $user_id, 'age', $_POST['age'] );

}

if(!empty( $_POST['exp_years'])){

update_usermeta( $user_id, 'exp_years', $_POST['exp_years'] );

}

}


Many Thanks,
Sean.

Answers (1)

2013-12-31

Fahad Murtaza answers:

<input type="text" name="age" required ...


add required in html.

This should help.

[[LINK href="http://www.w3schools.com/html/html5_form_attributes.asp"]]http://www.w3schools.com/html/html5_form_attributes.asp[[/LINK]]


Fahad Murtaza comments:

Also, for the server end, I'd recommend you to use this plugin.

This one saved me countless hours of coding the extra fields for users and error messages for validation etc.

[[LINK href="http://wordpress.org/plugins/theme-my-login/"]]http://wordpress.org/plugins/theme-my-login/[[/LINK]]

This page explains about the required fields validation in the second heading i.e "2. Validate the new fields (optional)"

[[LINK href="http://www.jfarthing.com/development/theme-my-login/adding-extra-registration-fields/"]]Adding Extra Registration Fields[[/LINK]]


Sean Gartlan comments:

Thanks for the response...

I am aware of the required attribute in html however I wasn't aware that this had anything bearing on wordpress php error messages??? I think I'm looking for a solution that utilises standard Wordpress error messaging...

Thanks,
Sean.


Fahad Murtaza comments:

No, it has nothing to do with the html5 attribute, just that its a good practice and takes care of the issue for most users and improves UX. For the solution to wordpress errors, I suggested plugin.

I am also going to suggest a solution for your existing code so you don't need to change anything.


Sean Gartlan comments:

Thanks again for the response...

Without boring you with specific details of the entire solution, a plugin is not what I'm looking for...

I am looking for code that targets an input or dropdown field as required, checks the field to determine whether it has been given a value and in the event that the page is saved without a value uses the standard Wordpress error messaging that appears at the top of the profile page...

Thanks,
Sean.


Fahad Murtaza comments:

Do something along these lines.



add_action( 'user_profile_update_errors', 'validate_field' );

function validate_field(&$errors, $update = null, &$user = null)
{
if (!preg_match("/^DUMMY_TEXT_[0-5]:[01]:\d+$/", $_POST['exp_years'])) // Change to check for empty or any regular expression.
{
$errors->add('empty_exp_years', "<strong>ERROR</strong>: Please select a valid value for exp years!");
}
}



The d3 within regex should check for number with lendth = 3. Same goes for d4

Another way to check if a year number of length 2 to 4 is:

^[0-9]{2,4}$


but your values are like

value1. value2, value3

So, you can simply do this






add_action( 'user_profile_update_errors', 'validate_field' );

function validate_field(&$errors, $update = null, &$user = null)
{
if ($_POST['exp_years']=='' or $_POST['exp_years']==NULL) // Change to check for empty or any regular expression.
{
$errors->add('empty_exp_years', "<strong>ERROR</strong>: Please select a valid value for exp years!");
}
}


Fahad Murtaza comments:

I haven't tested the code, just typed here, so if there is a syntax error, please fix :)


Sean Gartlan comments:

Fahd,

Thanks that looks like just what I need...

So using the example;

<tr>
<th><label for="dropdown">Years Of Experience</label></th>
<td>
<?php
//get dropdown saved value
$selected = get_the_author_meta( 'exp_years', $user->ID );
?>
<select name="exp_years" id="exp_years" style="width:100%;">
<option value=""></option>
<option value="value1" <?php echo ($selected == "value1")? 'selected="selected"' : '' ?>>Less than 1 year</option>
<option value="value2" <?php echo ($selected == "value2")? 'selected="selected"' : '' ?>>1-3 years</option>
<option value="value3" <?php echo ($selected == "value3")? 'selected="selected"' : '' ?>>4-7 years</option>
<option value="value4" <?php echo ($selected == "value4")? 'selected="selected"' : '' ?>>8-15 years</option>
<option value="value5" <?php echo ($selected == "value5")? 'selected="selected"' : '' ?>>15+ years</option>
</select>

<span class="description">Years of experience.</span>
</td>
</tr>



Where do I place your code into my functions.php file???

Above or below the;

add_action( 'show_user_profile', 'my_show_extra_profile_fields' );
add_action( 'edit_user_profile', 'my_show_extra_profile_fields' );


Or nested within the html???

Or above or below the save;

add_action( 'personal_options_update', 'my_save_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'my_save_extra_profile_fields' );


I have tried placing it in a few different positions, however the user update takes place successfully...

I was assuming (probably incorrectly) that if the initial dropdown value select was <option value=""></option> then it was equal to NULL and upon saving an error message would result??? Please excuse my ignorance...

Many Thanks,
Sean.


So where


Fahad Murtaza comments:

It should be in functions.php

Just append it to the functions.php


Sean Gartlan comments:

Fahd,

Sorry must have been a caching issue... Updated your suggested code to include other fields and it works like a charm...

You have solved this and I have 100% satisfaction with your solution... I really appreciate your assistance and such a quick response...

Many Thanks,
Sean.


Sean Gartlan comments:

Fahd,

Sorry one final question regarding your solution...

As you would have noticed from the first code snippet that I posted, depending on the users role they will see differing profile custom fields... So some roles will see more custom fields than others...

When I use your solution to ensure mandatory fields are completed correctly I have a problem with the error output...

If a particular role can only see one custom field and they fill it out correctly they receive error messages for not completing custom fields they cannot see...

I need some logic to distinguish the error output based on the role...

I'm using this to hide or show fields currently;

<?php } if($user->has_cap('s2member_level1')) {// Custom fields only display to Level 1 accounts?>

// fields

<?php if($user->has_cap('s2member_level2')) { // Custom fields only display to business accounts?>

// fields

Thanks,
Sean.