Custom variation input

Hey everyone,

I made a custom quantity input (x1, x3 and x3) that looks something like this: https://imgur.com/a/sVMDTMk

I achieved this using Javascript to modify the value of the input provided below:

<input type="number" id="quantity_61b90a7cab27c" class="input-text qty text" step="1" min="1" max="10" name="quantity" value="1" title="Količina" size="4" placeholder="" inputmode="numeric">

When a user clicks on either x1, x3 or x3 I update the value accordingly.

Now I have an issue with variations. I use Javascript to append multiple variation inputs to the DOM but the issue is that the back-end doesn’t know how to process multiple variations when adding the specified quantity of products to the cart.

My question: How can I modify the back-end logic to actually add different variations of the specified quantity (e.g when a user selects x3 he can choose 2 red T-shirts and one blue T-shirt)

When I inspected the code of some other Woocommerce websites that do this I noticed that they generate multiple variation inputs and change value (that is sent using the from a single value to array, like this:

– Single value
<select id="choose-color" class="" name="attribute_choose-color" data-attribute_name="attribute_choose-color" data-show_option_none="yes"><option value="">Choose color</option><option value="Blue" class="attached enabled">Blue</option><option value="Red" class="attached enabled">Red</option></select>
– Variations name="attribute_choose-color[1], name="attribute_choose-color[2] and so on.. but my endpoint is not prepared for it and I get and error

Warning: preg_match() expects parameter 2 to be string, array given in /home/customer/www/megatrgovina.si/public_html/wp-includes/formatting.php on line 1586