Insert into array

Question

I’m trying to make a system where, the user selects the products and adds in a list, without the page being reloaded again. At first I made sure the page was not reloaded again using ajax, but I have two problems, the first is that the fields of data on the customer are erased without what I wanted, the data that should be erased would be only those of the product, and the second is that I can’t think of a way to insert the data in a list and showlos posteriormente in a separate table, name, price and the total.
Ajax

$("#adicionar").click(function()
{
    $.ajax({
        type: 'POST',
        url: '../Model/resultado.php',
        success: function(data)
        {
            $(".table").append(data);
        }
    });
});

Order form

<div class="col-xs-12">
    <!-- Nome -->
    <div class="col-xs-3">
        <!-- Legenda -->
        <label for="nomeProduto" class="label label-primary">Nome do Produto</label>

        <!-- Campo -->
        <select class="form-control text-center" name="produto" id="nomeProduto" tabindex="2" title="Nome do Produto" onfocus="completarCamposProdutos();">
            <option value=""></option>
            <?php
                foreach ($produtos as $produto)
                {
                    ?>
                        <!-- Opcoes -->
                        <option
                            value="<?= $produto['id'] ?>"
                            data-preco="<?= $produto["valorVenda"] ?>"
                            data-estoque="<?= $produto['quantidadeAtual'] ?>">
                            <?= $produto['nomeProduto'] ?>
                        </option>
                    <?php
                }
              ?>
        </select>
    </div>

    <!-- Valor Unitario -->
    <div class="col-xs-2">
        <!-- Legenda -->
        <label for="valorUnitario" class="label label-primary">Valor Unitário</label>

        <!-- Campo -->
        <input type="text" name="valorUnitario" id="valorUnitario" class="form-control text-center" readonly="" title="Valor Unitario" placeholder="Valor Unitario">
    </div>

    <!-- Quantidade -->
    <div class="col-xs-2">
        <!-- Legenda -->
        <label for="quantidade" class="label label-primary">Quantidade</label>

        <!-- Campo -->
        <input type="text" name="quantidade" id="quantidade" class="form-control text-center" placeholder="Quantidade" title="Quantidade" tabindex="3">
    </div>

    <!-- Total -->
    <div class="col-xs-2">
        <!-- Legenda -->
        <label for="total" class="label label-primary">Total</label>

        <!-- Campo -->
        <input type="text" name="totalUnitario" id="total" class="form-control text-center" title="Total" placeholder="Total" readonly="">
    </div>

    <!-- Restante estoque -->
    <div class="col-xs-2">
        <!-- Legenda -->
        <label for="estoque" class="label label-primary">Estoque restante</label>

        <!-- Campo -->
        <input type="text" name="estoque" id="estoque" class="form-control text-center" title="Estoque Restante" placeholder="Estoque Restante" readonly="">
    </div>

    <!-- Cadastrar -->
    <div class="col-xs-1">
        <a href="" class="btn btn-success form-control" id="adicionar" tabindex="4">OK</a>
    </div>

    <!-- Carregando ajax -->
    <script language="javascript" src="../Util/JavaScript/AdicionarProdutosEmPedidos.js"></script>
</div>

Result.php

<?php
    // Requerindo arquivos
    require_once "../Util/Seguranca/ControleAcesso.php";

    // Funcao que protege a logica contra acesso nao autorizado
    ProtegePagina();

    // Recebendo parametros por post
    $nomeProduto = $_POST['produto'];
    $valorUnitario = $_POST['valorUnitario'];
    $quantidade = $_POST['quantidade'];
    $total = $_POST['totalUnitario'];