Dynamic form and send to mysql via jquery and ajax

Question

I have already asked some questions about this, I was helped, but kind of the way they said it only works if the form is normal, with inputs with name "something here" my form only has an input "text" name "table" to put The table number the rest of the form comes via mysql ajax. My question is how can I pass this form to the database since it is dynamic? My code below.

My form

<div class="well">


                <!-- left -->
                <div id="theproducts" class="col-sm-5">
                </div>
                <!-- left -->
                <form method="post" action="relatorio.php" id="formRel">
                <span>Mesa</span>
         <input type="text" id="numero_mesa" name="numero_mesa">
                <input type="text" id="theinputsum">

                <!-- right -->
                <div id="thetotal" class="col-sm-7">
                   <h1 id="total"></h1>
                   <button type="submit" class="btn btn-lg btn-success btn-block"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Finalizar Pedido</button>
                </form>
                </div>
               <!-- right -->


            </div>

And the javascript code.

<script>
$('#formRel').submit(function(event){
        event.preventDefault();
        var formDados = new FormData($(this)[0]);
$.ajax({
  method: "POST",
  url: "relatorio.php",
  data: $("#formRel").serialize(),
  dataType : "html"
})
};
 </script>

The insert query is like this.

<?php
error_reporting(-1);
ini_set('display_errors', 'On');


//Criar a conexao
$link = new mysqli ("localhost", "root", "", "restaurant");
if($link->connect_errno){
     echo"Nossas falhas local experiência ..";
     exit();
}
//echo "<pre>"; print_r($_POST); exit;
$mesa = $_POST['numero_mesa'];
$pedido = $_POST['products'];
$preco = $_POST['products'];


$sql = "INSERT INTO spedido ('pedido','preco','numero_mesa') VALUES ('$mesa','$pedido','$preco')";

$link->query($sql);





?>

enter image description here

Answer 1

<script>
$(document).on('submit', '#formRel', function(event) {
    event.preventDefault();
    var numero_mesa = $('#numero_mesa').val();
    $.ajax({
        type: "POST",
        url: "relatorio.php?",
        data: "numero_mesa="+ numero_mesa+
        "&products="+ products,
        success: function (data) {
            alert(data) // this will send you a message that might help you see whats going on in your php file
        });
    })
};
</script>