Introducing "attributes" for Inputs in Meta Box 4.7

The latest version 4.7 of Meta Box has been just released today with a new improvement which allow users to add custom attributes for inputs like text, URL, email fields. This feature is very helpful if developers want to add something like data-* attribute for their custom JS code.

To add custom attributes to the fields, just define them as a 'key' => 'value' like this:

'attributes' => array(
'disabled' => true,
'minlength' => 10,
),

If you want to add custom data-* attribute, you can add like this:

'attributes' => array(
// Simple value
'data-option1' => 'value1',
// Array of values
'data-option2' => json_encode( array( 'key1' => 'value1', 'key2' => 'value2' ) ),
),

Currently, this feature is supported in field text, url, email, checkbox, radio, date, time, datetime field.

Common attributes disabled, required, readonly, maxlength and pattern are also registered to be used as global parameters for fields, so you can use both these ways below as they are the same:

'attributes' => array(
'disabled' => true,
'required' => true,
'readonly' => true,
'maxlength' => true,
'pattern' => true,
),

// or simpler, e.g. without wrapping inside 'attributes'

'disabled' => true,
'required' => true,
'readonly' => true,
'maxlength' => true,
'pattern' => true,

The new version 4.7 also added js_options for color field, which allows you to add a custom option for the color picker. All the options for color picker can be listed in its homepage:

'js_options' => array(
'hide' => true,
'palettes' => ['#125', '#459', '#78b', '#ab0', '#de3', '#f0f']
)

The last but not least fix in this version of Meta Box is the fix for file_advanced and image_advanced fields which doesn't show the files immediately after upload.

So, if you use old version of Meta Box, please update it immediately and enjoy the new functionality.