Sending php/jquery data to mysql

Question

How could I send the data from the index.php screen to mysql , being that the javascript/jquery was used to do this function that is being shown in the image below.

my code is below :

My index

<div class="container">
    <h1 class="restaurant-title">Peixaria</h1>

    <div id="menu-panel" class="col-sm-12 paddingselect">
        <?php categoriaas(); ?>
    </div>

    <div id="menu-panel-2"></div>

    <div id="caja-panel">
        <div class="well">

            <!-- left -->
            <div id="theproducts" class="col-sm-5"></div>

            <!-- left -->
            <input type="text" id="theinputsum">

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

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<!-- Restaurant -->
<script src="js/restaurant.js"></script>

My processfunction:

require_once 'resfunctions.php';

if (isset($_POST['categoria'])) {
    getproductos($_POST['categoria']);
}

And others that if I ask the question will get big. I am grateful in advance.

Answer 1

Since you are already using jQuery, use its Ajax function (http://api.jquery.com/jquery.ajax/).

You call the PHP file that you will insert into Mysql, return the javascript and do the other javascript procedures.

An example of using the ajax function

$.ajax({
  method: "POST",
  url: "some.php",
  data: $("#iDdoForm").serialize()
})
  .done(function( retorno) {
    alert( "faça as ações necessárias de acordo com o retorno" );
  });