How to replace radio buttons with a drop down list?

Question

PHP

There is an online store with various forms of payment. There is a need to replace the choice of the ul-li-input[type="radio"] construction with select-option (if I replace the class class="input-radio" with class="input-radio payment_method_<?php echo $gateway->id; ?>" - a select with empty fields is displayed)

/* исходный код */
<ul class="payment_methods methods">
  if ( ! empty( $available_gateways ) ) { foreach ( $available_gateways as $gateway ) {
  <li class="payment_method_<?php echo $gateway->id; ?>">
    <input id="payment_method_<?php echo $gateway->id; ?>" type="radio" class="input-radio" name="payment_method" value="<?php echo esc_attr( $gateway->id ); ?>" <?php checked( $gateway->chosen, true ); ?> data-order_button_text="
    <?php echo esc_attr( $gateway->order_button_text ); ?>" />
    <label for="payment_method_<?php echo $gateway->id; ?>">
      <?php echo $gateway->get_title(); ?>
      <?php echo $gateway->get_icon(); ?>
    </label>
  </li>
  }
</ul>

/* меняем на селект */
<select class="payment_methods methods">
  if ( ! empty( $available_gateways ) ) { foreach ( $available_gateways as $gateway ) {
  <option id="payment_method_<?php echo $gateway->id; ?>" class="input-radio" name="payment_method" value="<?php echo esc_attr( $gateway->id ); ?>" selected="<?php ( $gateway->chosen, true ); ?>" data-order_button_text="<?php echo esc_attr( $gateway->order_button_text ); ?>">
    <?php echo $gateway->get_title();?></option>
  }
</select>

but when checking

$available_gateways = 
WC()->payment_gateways->get_available_payment_gateways();
if ( ! isset( $available_gateways[ $this->posted['payment_method'] ] ) ) {
$this->payment_method = '';
wc_add_notice( __( 'Invalid payment method.', 'woocommerce' ), 'error' );
}

I get an error "invalid payment method", and if you look at what is output using var_dump($available_gateways);, then I get an error of a different kind undefind symbol a What can you advise?

Answer 1

The "name" attribute should be specified on the "select" element, not on the "option" element

<select class="payment_methods methods" name="payment_method">
    <option value="">Something</option>
    <option value="">Other thing</option>
    ...
</select>