<div class="container">
    <div class="row text-center">
    <H1 class="mb-3">Заказ пиццы</H1>
        <form  method="post" name="ourf">
            <div class="form-group">
                <select id="single" class="form-control asd" name="search" >
                    <option value="888" style='display:none;' disabled selected>Выберите пиццу</option>
                        <option value ="111">111</option>
                  <option value ="1111">1111</option><option value ="11111">11111</option><option value ="111111">111111</option>
                </select>

                <select  class="form asd" id="single1" name="search" >
                    <option value=""  style='display:none;' disabled selected >Выберите размер</option>
                    
                        <option value ="222">222</option>
                  <option value ="2222">2222</option>
                   <option value ="22222">22222</option>
                   <option value ="222222">222222</option>
                   
                    
                </select>


                <select id="single2" class="form asd" name="search"  >
                    <option value="" style='display:none;' disabled selected>Выберите пиццу</option>

                    
                        <option value ="333">333</option>
                                      
                        <option value ="3333">3333</option>                    
                        <option value ="33333">33333</option>                    
                        <option value ="333333">333333</option>
                    
                </select>
            </div>
          <br/>
          <input type="hidden" name="order" id="order" value=""/>
          <br/>
            <b>Ваш заказ: </b><div id="result"></div><br/>
          <input type="submit" id="target" value="Отправить" name="search1">
        </form>
    </div>
</div>

<div id="response"></div>
span{
  margin:3px;

}
#result{
  
  border-bottom: 1px #333 dashed;
    max-width: 300px;
}
  
const result = document.querySelector('#result');
const form   = document.querySelector('form');
const order  = document.querySelector('#order');
form.addEventListener('submit',function(event){
  event.preventDefault();
     result.innerHTML ='';
     let servResponse=document.querySelector('#response');
     let data = new FormData(document.querySelector("form"))
     console.log(data)
     let xhr= new XMLHttpRequest();
     xhr.open("POST","mysqli.php");
     xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
     xhr.onreadystatechange=function (){
        if (xhr.readyState===4 && xhr.status===200){
            servResponse.textContent=xhr.responseText;
        }
     }
  
    xhr.send(data);
               
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.