如何向Woocommerce签出页面添加带有搜索选项的下拉列表

Question

请帮助:我想在我们的Woocommerce网站的结账页面上添加我们的营销人员的下拉列表。如何将当前的代码更改为: 1)添加搜索选项，其中有人可以开始键入名称或城市以进行快速选择，2)返回值而不是键？目前，我们订单的输出是: Marketer: mariaMarais，而不是Marketer: mariaMarais- Natal。

另外，我需要增加大约200个营销者，代码会像这样工作吗?还是太大了？

    // add marketer list

//* Add select field to the checkout page
add_action('woocommerce_before_order_notes', 'wps_add_select_checkout_field');
function wps_add_select_checkout_field( $checkout ) {

  echo '<br><br>';

  woocommerce_form_field( 'myquestion', array(
      'type'          => 'select',
      'class'         => array( 'wps-drop' ),
      'label'         => __( 'Please select your Argilla marketer.' ),
      'required'      => true,
      'options'       => array(
          'headoffice'   => __( 'Head Office', 'wps' ),
          'mariaMarais' => __( 'Maria Marais - Natal', 'wps' )
      )
 ),

  $checkout->get_value( 'myquestion' ));

}

//* Update the order meta with field value
 add_action('woocommerce_checkout_update_order_meta', 'wps_select_checkout_field_update_order_meta');
 function wps_select_checkout_field_update_order_meta( $order_id ) {

   if ($_POST['myquestion']) update_post_meta( $order_id, 'myquestion', esc_attr($_POST['myquestion']));

 }

 //* Display field value on the order edition page
add_action( 'woocommerce_admin_order_data_after_billing_address', 'wps_select_checkout_field_display_admin_order_meta', 10, 1 );
function wps_select_checkout_field_display_admin_order_meta($order){

  echo '<p><strong>'.__('Found by').':</strong> ' . get_post_meta( $order->id, 'myquestion', true ) . '</p>';

}

//* Add selection field value to emails
add_filter('woocommerce_email_order_meta_keys', 'wps_select_order_meta_keys');
function wps_select_order_meta_keys( $keys ) {

  $keys['My Marketer:'] = 'myquestion';
  return $keys;

}

Answer 1

这将将select2 (selectWoo)添加到下拉列表中。Select2已经以selectWoo的形式在结帐页面上排队。

//* Add select field to the checkout page
add_action('woocommerce_before_order_notes', 'dd_add_select_two_checkout_field');
function dd_add_select_two_checkout_field( $checkout ) {
    woocommerce_form_field( 'myquestion', array(
        'type'          => 'select',
        'class'         => array( 'select2-wrapper' ),
        'label'         => __( 'Please select your Argilla marketer.' ),
        'required'      => true,
        'input_class'   => array( 'add-select2' ),
        'options'       => array( // added extra for effect.
            'headoffice'    => __( 'Head Office', 'wps' ),
            'mariaMarais'   => __( 'Maria Marais - Natal', 'wps' ),
            '7headoffice'   => __( 'Head Office', 'wps' ),
            '2mariaMarais'  => __( 'Maria Marais - Natal', 'wps' ),
            '2headoffice'   => __( 'Head Office', 'wps' ),
            '4mariaMarais'  => __( 'Maria Marais - Natal', 'wps' ),
            '4headoffice'   => __( 'Head Office', 'wps' ),
            '6mariaMarais'  => __( 'Maria Marais - Natal', 'wps' ),
            '6headoffice'   => __( 'Head Office', 'wps' ),
            '8mariaMarais'  => __( 'Maria Marais - Natal', 'wps' ),
        )
    ),
    $checkout->get_value( 'myquestion' ));
    wc_enqueue_js( "$( '.add-select2' ).selectWoo(); ");
}