Wordpress - Validating Custom Meta Box Values & Required Fields
The easiest way is to add Javascript validation via the jQuery Validate plugin. Here's the most basic walkthrough:
Near your add_meta_box call, enqueue the jQuery Validate plugin as well as a JS file for your simple script:
add_action('admin_enqueue_scripts', 'add_my_js');
function add_my_js(){
wp_enqueue_script('my_validate', 'path/to/jquery.validate.min.js', array('jquery'));
wp_enqueue_script('my_script_js', 'path/to/my_script.js');
}
Then in my_script.js include the following:
jQuery().ready(function() {
jQuery("#post").validate();
});
This will enable validation on the post form. Then in the add_meta_box callback where you define the custom fields, you'd add a "required" class for each field you wish to validate, like so:
<input type="text" name="my_custom_text_field" class="required"/>
All fields with "required" in their class will be validated when the post is saved/published/updated. All of the other validation options (rules, error styling, etc) can be set in the document.ready function in my_script.js; check the jQuery Validate docs for all the options.
The Complete Basic Code to add jQuery Validation:
Enqueue the validation script. I assume jQuery is already enqued.
add_action('admin_enqueue_scripts',function($id){ $validation',$validation_js_url = #your validation.js source; wp_register_script( 'validation',$validation_js_url,array(),'',true ); wp_enqueue_script( 'validation' ); });
In the js file or script tag:
jQuery(document).ready(function($){ var form = $("form[name='post']"); $(form).find("input[type='submit']").click(function(e){ e.preventDefault(); $(form).validate(); if($(form).valid()) { $("#ajax-loading").show(); $(form).submit(); }else{ $("#publish").removeClass().addClass("button-primary"); $("#ajax-loading").hide(); } }); });
Done :)
I used this code, very helpful, justa changed:
$(form).find("input[type='submit']").click(function(e){
To:
$(form).find("#publish").click(function(e){
'Cause if you have another form inside the main form this start the script.
And:
$(form).submit();
To:
$(this).submit();
'Cause the first line only save the post as draft and you can't publish it no more.
Written everything here: http://allgraphics.it/blog/2012/10/jquery-validation-sui-campi-di-input-postcustom-post-di-wordpress/