foreach ($pro as $item) {
    <input type="hidden" name="combo_pro_id[]" value="<?= $item; ?>" readonly>

<select class="form-control combo_emp_id" required name="combo_emp_id[]" id="combo_emp_id">
          <option value="">Select now</option>
          <option value="1">1</option>
          <option value="2">2</option>
</select>

<button type="button" id="combo_add_cart">Add</button>
}
   $(document).on("click", "#combo_add_cart", function() {
        var combo_id = $("#combo_emp_id").val();
        if (combo_id == '') {
            $('.manAlert').show();
        } else {
            var combo_id = $("#combo_id").val();

            var combo_pro_id = {};
            var i = 1;
            $("input[name='combo_pro_id[]']").each(function(){
                combo_pro_id[i] = $(this).val();
                i++;
            });
            
            var combo_emp_id = {};
            var j = 1;
            $("select[name='combo_emp_id[]']").each(function(){
                combo_emp_id[j] = $(this).val();
                j++;
            });
                        
            // alert(JSON.stringify(combo_emp_id));

            var type = 'combo';
            $('#combo_modal').modal('toggle');
            $("#combo_emp_id").val('');

            var action = "add";
            $.ajax({
                url: "includes/cart_action.php",
                method: "POST",
                data: {
                    combo_id: combo_id,
                    combo_pro_id: combo_pro_id,
                    combo_emp_id: combo_emp_id,
                    type: type,
                    action: action
                },
                success: function(data) {
                    service_load_cart();
                }
            });
        }
    });

    $(document).on("click", ".combo_close", function() {
        $('.manAlert').hide();
    });




https://stackoverflow.com/questions/43890074/how-to-send-data-multiple-same-name-input-using-ajax-and-php

html
 <div class="col-md-2">
                                        <div class="form-group">
                                            <label>Customer Name</label>
                                            <input type="text" class="form-control" id="searchName" placeholder="Customer Name" />
                                            <div id="searchOutput"></div>
                                        </div>
                                    </div>

js
$(document).ready(function() {
        $('#searchName').on("keyup", function() {
            var getName = $(this).val();
            $.ajax({
                url: 'includes/customer_name.php',
                method: 'POST',
                data: {
                    name: getName
                },
                beforeSend: function() {
                    $("#searchName").css("background", "#FFF url(loader.gif) no-repeat 165px");
                },
                success: function(data){
                    $("#searchOutput").show();
                    $("#searchOutput").html(data);
                    $("#searchName").css("background", "#FFF");
                }
            });
        });
    });

    function selectName(val) {
        $("#searchName").val(val);
        $("#searchOutput").hide();
    }

file: customer_name.php
<?php
session_start();
require_once("db_connect.php");

$name = $_POST['name'];
$sql = "SELECT * FROM sd_client WHERE name LIKE '$name%'";
$query = mysqli_query($mysqli, $sql); ?>

<select id="searchList" multiple name="m_id" class="form-control">
    <?php
        while ($row = mysqli_fetch_assoc($query)) { ?>
            <option onClick="selectName('<?= $row["name"]; ?>');" value="<?= $row["id"]; ?>"> <?= $row["name"]; ?> </option>
    <?php } ?>
</select>

css

<style>
    #searchList {
        float: left;
        list-style: none;
        margin-top: -3px;
        padding: 0;
        width: 240px;
        position: absolute;
        overflow-y: auto;
        height: auto;
    }

    #searchList option {
        padding: 8px;
        border-bottom: #bbb9b9 1px solid;
    }

    #searchList option:hover {
        background: #ece3d2;
        cursor: pointer;
    }

    #searchName {
        padding: 10px;
        border: #a8d4b1 1px solid;
        border-radius: 4px;
    }
</style>

source
https://phppot.com/jquery/jquery-ajax-autocomplete-country-example/

<select id="item_id" onchange="item_id()">
                        <option value="">Select product</option>
<option value="1">1</option>
</select>





 function item_id(){
        var item_id = $('#item_id').val();
        var action = "add";
        $.ajax({
            url: "includes/product_action.php",
            method: "POST",
            data: {
                item_id: item_id,
                action: action
            },
            success: function(data) {   
                // $('#item_id').val('');   
                $('#item_id').find(':selected')[0].remove();
                product_load_cart();
            }
        });
      };

html
<input type="number" for="" id="unitPrice">
php
$data = array(
     'unit'  => $unit,
     'sell'  => $sell
);
echo json_encode($data);

ajax store
dataType: "json",
success: function(data){
   $('#unitPrice').val(data.sell);
   $('#unitPrice').attr('for', data.unit);
}

ajax receive
$("#unitPrice").attr('for');

Fetch API
Axios
GraphQL
WebSockets
Server-Sent Events (SSE)