WooCommerce 自定义字段 - 多选

Posted

技术标签:

【中文标题】WooCommerce 自定义字段 - 多选【英文标题】:WooCommerce Custom Fields - Multiselect 【发布时间】:2012-11-20 23:52:06 【问题描述】:

我正在向 WooCommerce 的结帐页面添加额外的字段,我可以添加文本框等基本字段,但需要添加一个(多)选择框,用户可以在其中选择多个项目。我已经弄清楚如何通过代码添加选择框,如下所示:

add_action('woocommerce_after_order_notes', 'my_custom_checkout_field');

function my_custom_checkout_field( $checkout ) 

    echo '<div id="my_custom_checkout_field"><h3>'.__('My Field').'</h3>';

    woocommerce_form_field( 'my_field_name', array(
        'type'          => 'select',
        'class'         => array('my-field-class form-row-wide'),
        'label'         => __('Fill in this field'),
        'placeholder'       => __('Enter something'),
        'options'           => array(
            'Buick' => __('Buick', 'woocommerce' ),
            'Ford' => __('Ford', 'woocommerce' )
        )
        ), $checkout->get_value( 'my_field_name' ));

    echo '</div>';


但这只是一个单一的选择下拉菜单。 我可以为多选做类似的事情吗? 或者你有推荐的 WooCommerce 扩展吗?

请指教,先谢谢了!

【问题讨论】:

【参考方案1】:

您需要创建自己的自定义字段类型处理程序。如果您查看WooCommerce source code,您会发现可以使用过滤器:'woocommerce_form_field_' . $args['type']

我还没有真正测试过,这只是来自单个“选择”控件的稍微修改的代码,但你明白了:

add_filter( 'woocommerce_form_field_multiselect', 'custom_multiselect_handler', 10, 4 );

function custom_multiselect_handler( $field, $key, $args, $value ) 

    $options = '';

    if ( ! empty( $args['options'] ) ) 
        foreach ( $args['options'] as $option_key => $option_text ) 
            $options .= '<option value="' . $option_key . '" '. selected( $value, $option_key, false ) . '>' . $option_text .'</option>';
        

        if ($args['required']) 
            $args['class'][] = 'validate-required';
            $required = '&nbsp;<abbr class="required" title="' . esc_attr__('required', 'woocommerce') . '">*</abbr>';
        
        else 
            $required = '&nbsp;<span class="optional">(' . esc_html__('optional', 'woocommerce') . ')</span>';
        

        $field = '<p class="form-row ' . implode( ' ', $args['class'] ) .'" id="' . $key . '_field">
            <label for="' . $key . '" class="' . implode( ' ', $args['label_class'] ) .'">' . $args['label']. $required . '</label>
            <select name="' . $key . '" id="' . $key . '" class="select" multiple="multiple">
                ' . $options . '
            </select>
        </p>' . $args['after'];
    

    return $field;

在您的代码中,只需将类型声明为“多选”:

add_action('woocommerce_after_order_notes', 'my_custom_checkout_field');

function my_custom_checkout_field( $checkout ) 

    echo '<div id="my_custom_checkout_field"><h3>'.__('My Field').'</h3>';

    woocommerce_form_field( 'my_field_name', array(
        'type'          => 'multiselect',
        'class'         => array('my-field-class form-row-wide'),
        'label'         => __('Fill in this field'),
        'placeholder'   => __('Enter something'),
        'options'       => array(
            'Buick' => __('Buick', 'woocommerce' ),
            'Ford' => __('Ford', 'woocommerce' )
        )
        ), $checkout->get_value( 'my_field_name' ));

    echo '</div>';


【讨论】:

有没有人想出如何让这些多选保存到管理员?我只保存最后选择的选项。【参考方案2】:

如果您在使用 sn-p 时遇到问题,可以使用此 woocommerce 插件轻松做到这一点。 “Woocommerce 轻松结帐字段编辑器”。你可以在codecanyon找到它

【讨论】:

【参考方案3】:

虽然回答这篇文章已经很晚了,但我添加这个解决方案是为了帮助那些仍在寻找解决方案的人。我们可以使用 custom_attributes 添加自定义数据,使其成为多选下拉菜单。

woocommerce_form_field('my_field_name',array(
   type=>"select",
   custom_attributes=>array("multiple"),
   options=>$options
));

【讨论】:

以上是关于WooCommerce 自定义字段 - 多选的主要内容,如果未能解决你的问题,请参考以下文章

c# WPF Telerik combobox 多选自定义显示值

WooCommerce API 的高级自定义字段

定位 WooCommerce 类别的高级自定义字段

自定义 woocommerce 结帐表单字段

php [使用操作和过滤器自定义结帐字段]保存WooCommerce自定义结帐字段

php [使用操作和过滤器自定义结帐字段]验证WooCommerce自定义结帐字段