Select Value Not Submitting

[rishiimmehra]

Actually I'm converting default woocommerce sorting select to M3 Web Select. Here is code,

<form class="woocommerce-ordering" method="get">
	<md-outlined-select form name="orderby" class="orderby" aria-label="<?php esc_attr_e( 'Shop order', 'woocommerce' ); ?>">
		<?php foreach ( $catalog_orderby_options as $id => $name ) : ?>
			<md-select-option value="<?php echo esc_attr( $id ); ?>" <?php selected( $orderby, $id ); ?>>
				<div slot="headline"><?php echo esc_html( $name ); ?></div>
			</md-select-option>
		<?php endforeach; ?>
	</md-outlined-select>
	<input type="hidden" name="paged" value="1" />
	<?php wc_query_string_form_fields( null, array( 'orderby', 'submit', 'paged', 'product-page' ) ); ?>
</form>

this code render select perfectly but after selecting it's not submiting it's value.

Here is woocommerce default sorting select which is working fine

<form class="woocommerce-ordering" method="get">
	<select name="orderby" class="orderby" aria-label="<?php esc_attr_e( 'Shop order', 'woocommerce' ); ?>">
		<?php foreach ( $catalog_orderby_options as $id => $name ) : ?>
			<option value="<?php echo esc_attr( $id ); ?>" <?php selected( $orderby, $id ); ?>><?php echo esc_html( $name ); ?></option>
		<?php endforeach; ?>
	</select>
	<input type="hidden" name="paged" value="1" />
	<?php wc_query_string_form_fields( null, array( 'orderby', 'submit', 'paged', 'product-page' ) ); ?>
</form>

is m3 select working is same as native or it's custom html component, if it's custom comp then how can it submit it's value and refresh the page with it's value.

[rishiimmehra]

I just add attribute onchange="this.form.submit()" in <md-outlined-select onchange="this.form.submit()" > and add <input type="hidden" value="wtf" /> before closing </md-outlined-select> . This solved my issue maybe it will help you to fix yours.
Use your own value don't put wtf

[asyncLiz]

I think the reason the native <select> submits the form on change is due to the same reasons listed in #4182. There are special conditions where pressing enter on a control inside a form will automatically submit it.

Submitting the form on the select's change event is the right approach.