4

I have some custom fields for my Woocommerce products inside my Inventory Tab using woocommerce_wp_text_input() function. I would like to add one more custom text field just for displaying a value for reference.

I want to lock the textfield by default so as not to be able to write something in it.

Is it possible?

LoicTheAztec
  • 229,944
  • 23
  • 356
  • 399
Maria Georgali
  • 629
  • 1
  • 9
  • 22

1 Answers1

7

Yes it is possible adding the as custom_attributes the readonly property in the field arguments array using:

'custom_attributes' => array('readonly' => 'readonly'),

So your code will be like:

add_action( 'woocommerce_product_options_stock_status', 'display_product_options_inventory_custom_fields', 20 );
function display_product_options_inventory_custom_fields() {
    global $post;

    echo '</div><div class="options_group">'; // New separated section

    // Text field (conditionally readonly)
    woocommerce_wp_text_input( array(
        'id'                => '_text_field_ro',
        'type'        => 'text',
        'label'       => __( 'Read only field', 'woocommerce' ),
        'placeholder' => __( 'placeholder text', 'woocommerce' ),
        'description' => __( 'Custom description: your explanations.', 'woocommerce' ),
        'desc_tip'    => true,
        'custom_attributes' => $readonly, // Enabling read only
    ) );
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

enter image description here


Update: Adding a checkbox to enable the readonly fields:

add_action( 'woocommerce_product_options_stock_status', 'display_product_options_inventory_custom_fields', 20 );
function display_product_options_inventory_custom_fields() {
    global $post;

    echo '</div><div class="options_group">'; // New separated section

    // Checkbox
    woocommerce_wp_checkbox( array(
        'id'          => '_enable_readonly',
        'label'       => __( 'Enable readonly fields', 'woocommerce' ),
        'description' => __( 'Enable some fields to be readonly', 'woocommerce' ),
        'desc_tip'    => true,
    ));

    // Get the checkbox value
    $checkbox = get_post_meta( $post->ID, '_enable_readonly', true );

    // We set the field attribute "readonly" conditionally based on the checkbox
    $readonly = empty($checkbox) ? '' : array('readonly' => 'readonly');

    // Text field 1 (conditionally readonly)
    woocommerce_wp_text_input( array(
        'id'                => '_text_field_ro1',
        'type'        => 'text',
        'label'       => __( 'Read only field 1', 'woocommerce' ),
        'placeholder' => __( 'placeholder text 1', 'woocommerce' ),
        'description' => __( 'Custom description 1: your explanations.', 'woocommerce' ),
        'desc_tip'    => true,
        'custom_attributes' => $readonly, // Enabling read only
    ) );

    // Text field 2 (conditionally readonly)
    woocommerce_wp_text_input( array(
        'id'                => '_text_field_ro2',
        'type'        => 'text',
        'label'       => __( 'Read only field 2', 'woocommerce' ),
        'placeholder' => __( 'placeholder text 2', 'woocommerce' ),
        'description' => __( 'Custom description 2: your explanations.', 'woocommerce' ),
        'desc_tip'    => true,
        'custom_attributes' => $readonly, // Enabling read only
    ) );
}

add_action( 'woocommerce_process_product_meta', 'save_product_custom_fields' );
function save_product_custom_fields( $post_id ) {
    // 1. readonly checkbox
    $readonly = isset( $_POST['_enable_readonly'] ) ? esc_attr( $_POST['_enable_readonly'] ) : '';
    update_post_meta( $post_id, '_enable_readonly', $readonly );

    // 2. Readonly fields: allow saving when readonly is disabled
    if( ! isset( $_POST['_enable_readonly'] ) ){
        // Save text field 1 value
        if( isset( $_POST['_text_field_ro1'] ) ){
            update_post_meta( $post_id, '_text_field_ro1', sanitize_text_field( $_POST['_text_field_ro1'] ) );
        }
        // Save text field 2 value
        if( isset( $_POST['_text_field_ro2'] ) ){
            update_post_meta( $post_id, '_text_field_ro2', sanitize_text_field( $_POST['_text_field_ro2'] ) );
        }
    }
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

Checkbox is disabled (fields are not readonly):

enter image description here

Checkbox is enabled (fields are readonly):

enter image description here

LoicTheAztec
  • 229,944
  • 23
  • 356
  • 399
  • Thank you. What if I want to have a checkbox next to it, to lock unlock the disabling? – Maria Georgali Sep 25 '18 at 12:34
  • @MariaGeorgali I have added an update finally with a checkbox that will enabled readonly fields. But next time is better to ask a new question. – LoicTheAztec Sep 26 '18 at 00:04
  • Thanks, it saved my life – Abdul Basit Apr 03 '20 at 20:28
  • @LoicTheAztec The original code sample, without checkbox, refers to `'custom_attributes' => $readonly` but that variable is not declared, only later in the checkbox-example. One fix is to use the initial one-liner `'custom_attributes' => array('readonly' => 'readonly'),` or to declare `$readonly = array('readonly' => 'readonly');` – Greg Jun 21 '21 at 23:04