mostrar un campo de texto obligatorio cuando se marca una casilla de verificación en el proceso de pago de WooCommerce

5 minutos de lectura

avatar de usuario
patricio

Estoy trabajando en una solución en el registro de woocommerce con casilla de verificación personalizada.

El plan es cuando alguien selecciona la casilla de verificación personalizada, se abre un campo de texto adicional y debe ser requerido.

La parte que funciona:

// add the special customer role
add_action('admin_init', 'uiwc_new_role');
function uiwc_new_role() {  
    add_role(
        'kundenkarte',
        "Kundenkarte",
        array(
            'read'         => true,
            'delete_posts' => false
        )
    );
}

add_action( 'woocommerce_after_order_notes', 'custom_checkout_field_with_wholesale_option' );
function custom_checkout_field_with_wholesale_option( $checkout ) {

    if( current_user_can( 'wholesale_customer' ) ) return; // exit if it is "wholesale customer"

    echo '<div id="wholesale_checkbox_wrap">';
    woocommerce_form_field('wholesale_checkbox', array(
        'type' => 'checkbox',
        'class' => array('input-checkbox'),
        'label' => __('Do you have a Customer Card?'),
        'placeholder' => __('card'),
        'required' => false,
        'value'  => true
    ), '');
    echo '</div>';

}

// Conditionally change customer user role
add_action( 'woocommerce_checkout_update_order_meta', 'wholesale_option_update_user_meta' );
function wholesale_option_update_user_meta( $order_id ) {
    if ( isset($_POST['wholesale_checkbox']) ) {
        $user_id = get_post_meta( $order_id, '_customer_user', true ); // Get user ID
        if( $user_id > 0 ){
            $user = new WP_User($user_id);
            $user->remove_role('customer');
            $user->add_role('kundenkarte');
        }
    }
}

Mi conocimiento de PHP es muy bajo.

  • Se eliminó su anexo a la pregunta, ya que se publicó en el espacio de respuesta. En su lugar, puede responder a LoicTheAztec debajo de su respuesta; si desea mostrar más código, puede usar un enlace GitHub Gist o Pastie.

    – mitad

    2 de julio de 2020 a las 12:55

avatar de usuario
LoicTheAztec

Actualizado (probado y funciona)

Con el siguiente código, cuando su casilla de verificación está marcada, se ve un campo de texto personalizado requerido (con validación y guardar como metadatos de usuario y metadatos de pedido):

add_action( 'woocommerce_after_order_notes', 'custom_checkout_field_with_wholesale_option' );
function custom_checkout_field_with_wholesale_option( $checkout ) {

    if( current_user_can( 'wholesale_customer' ) ) return; // exit if it is "wholesale customer"

    echo '<style> #wholesale_card_field.hidden { display:none; }</style>
    <div id="wholesale_checkbox_wrap">';

    woocommerce_form_field('wholesale_checkbox', array(
        'type' => 'checkbox',
        'class' => array('input-checkbox'),
        'label' => __('Do you have a Customer Card?'),
        'placeholder' => __('card'),
        'required' => false,
        'value'  => true
    ), '');

    woocommerce_form_field('wholesale_card', array(
        'type' => 'text',
        'class' => array('hidden'),
        'placeholder' => __('Customer card Id'),
        'required' => true,
    ), '');

    echo '</div>';

    ?>
    <script>
    jQuery(function($){
        $('#wholesale_checkbox_field input').click(function(){
            if( $(this).is(':checked')) {
                $('#wholesale_card_field').css('display', 'none').removeClass('hidden').show();
            } else if ( ! $(this).is(':checked') && $('#wholesale_card_field').css('display') !== 'none' ) {
                $('#wholesale_card_field').hide();
            }
        });
    });
    </script>
    <?php

}

// Validation
add_action( 'woocommerce_checkout_process', 'wholesale_option_validation' );
function wholesale_option_validation() {
    if ( isset($_POST['wholesale_checkbox']) && isset($_POST['wholesale_card']) && empty($_POST['wholesale_card']) ) {
        wc_add_notice( __("Please fill in your customer card Id"), "error" );
    }
}

// Conditionally change customer user role and add customer card as order and user meta
add_action( 'woocommerce_checkout_update_order_meta', 'wholesale_option_update_meta' );
function wholesale_option_update_meta( $order_id ) {
    if ( isset($_POST['wholesale_checkbox']) ) {
        $user_id = get_post_meta( $order_id, '_customer_user', true ); // Get user ID
        if( $user_id > 0 ){
            $user = new WP_User($user_id);
            $user->remove_role('customer');
            $user->add_role('kundenkarte');
        }

        // Add customer card Id as order metadata
        if ( isset($_POST['wholesale_card']) ) {
            update_post_meta( $order_id, 'wholesale_card', sanitize_text_field( $_POST['wholesale_card'] ) );

            if( $user_id > 0 )
                update_user_meta( $user_id, 'wholesale_card', sanitize_text_field( $_POST['wholesale_card'] ) );
        }
    }
}

// Display customer card on admin order edit page under billing address
add_action( 'woocommerce_admin_order_data_after_billing_address', 'display_wholesale_option_admin_order', 10, 1 );
function display_wholesale_option_admin_order( $order ){
    echo '<p><strong>'.__('Card Id').':</strong> ' . $order->get_meta( 'wholesale_card' ) . '</p>';
}

El código va en el archivo functions.php de su tema secundario activo (o tema activo). Probado y funciona.

  • De una respuesta (ahora eliminada). “No puede usar mi código de respuesta en una respuesta a su propia pregunta, ya que no es justo”: esto no es del todo cierto. Ciertamente, es el caso de que alguien no debería tomar su código y luego aceptarlo (eso justificaría una bandera de moderador, creo). Sin embargo, una persona puede tomar su código y construir sobre él, siempre que le dé atribución; que está permitido dentro de las condiciones de la licencia. La imparcialidad de quién obtiene la marca de aceptación (y cuánto trabajo estuvo involucrado en la copia original y modificada) depende entonces del autor de la pregunta.

    – mitad

    2 de julio de 2020 a las 12:52


  • @halfer Lo siento, pero este es un usuario nuevo que no conoce las prácticas de StackOverFlow y ha usado una respuesta como zona de comentarios, pensando que seré notificado… No he estado hablando de aceptación o votos en ningún momento… Mi ” justicia” es mi opinión personal, eso es todo, y no tiene nada de malo.

    – LoicTheAztec

    2 de julio de 2020 a las 13:11


  • ¿Cómo voto por LoicTheAztec? ¿Esto es seleccionar la flecha pequeña?

    – patricio

    3 de julio de 2020 a las 7:55

  • ¿Dónde debo escribir el campo de texto que no se está guardando?

    – patricio

    3 de julio de 2020 a las 7:56

  • hola, gracias lo veo en los detalles del pedido, pero era mi pregunta para verlo en el perfil de usuario

    – patricio

    4 de julio de 2020 a las 6:56

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad