how to make promises of Javascript to insert data in a table with Json data

1

I hope you can help me with this little problem that has not allowed me to really move forward. I do not know much about this and I have been receiving help and they helped me with javascript promises and I did not manage them, and I can not move forward. at the time of putting a data in my input-text this validates if it is in the database then it opens a modal window in which I have another input-text where I enter another data and I add the information to the table, then what I need to do and I hope you help me with this is that when I accept the modal button, I will add the information of the first data that I entered in my first input-text.

html of the first input-text

<section>

          <input type="text" name="codigo" id="serial" placeholder="Escanear Codigo de Barras del DN" class="codigo"/>

                <button class="btn btn-info " id="descargar" name="descargar">Descargar <span class="glyphicon glyphicon-save"></span></button>
            </section>
            <section class="tsect">
                <table class="grilla" id="tabla">
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>NetApp Po</th>
                            <th>Costumer Np</th>
                            <th>Qty</th>
                            <th>Rev</th>
                            <th>Boxes by Po</th>
                            <th>Pallet Status</th>
                            <th>DN Equipo</th>
                            <th>create Date Asn</th>
                            <th>Shipping Address</th>
                            <th>Description</th>
                            <th>So No</th>
                        </tr>
                    </thead>
                    <tbody id="dnsalida">

                    </tbody>
                </table>
            </section>

modal that opens when entering a data

<div class="modal fade" id="scanSerial" tabindex="-1" role="dialog">
              <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <h5 class="modal-title">Escanear los S/N</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">&times;</span>
                    </button>
                  </div>
                  <div>

                            <input type="text" name="codigo" id="codigo" placeholder="Escanear S/N" class="codigo"/>

                            <br>    <br>

                            <section class="tsect">
                                <table class="grilla" id="tabla">
                                    <thead>
                                        <tr>
                                            <th>Id</th>
                                            <th>DN</th>
                                            <th>NET APP PO</th>
                                            <th>SERIAL NUMBER</th>
                                            <th>SECOND PPID</th>
                                            <th>SHIPPING SN</th>
                                            <th>MODEL NAME</th>
                                        </tr>
                                    </thead>
                                    <tbody id="registros">

                                    </tbody>
                                </table>

                            </section>

                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" id="infoDN" >Aceptar</button>
                  </div>
                </div>
              </div>
            </div>

Script with which they helped me

<script type="text/javascript">
            var currentDn = null;
            var serials = [];




            // limpia todas las variables globales
            function limpiarGlobales () {
                // currentDn = null;
                serials = [];
            }

            function limpiarTabla() {
                console.log('limpiando tabla');
                $("#tabla tbody").empty();
            }

            function validarDn (value) {
                return new Promise((resolve, reject) => {
                    $.post('/pruebas/stark/php/busqueda.php',
                    {
                    value: value
                    },
                    function(data, status){
                            let dataParsed = JSON.parse(data);
                            console.log('data: ' + data);
                            console.log('dataParsed: ' + dataParsed);
                            if (dataParsed.isValid) {
                                currentDn = value;
                            }
                            resolve(dataParsed.isValid);
                });
                })
            }

            // Decidir si abrir modal
            $("#serial").focus();
            $("#serial").on('keyup', function escanDn(e) {
                // console.log('e: ' + JSON.stringify(e))
              var keycode = (e.keyCode ? e.keyCode : e.which);
                console.log('keycode on serial: ' + keycode)
              if (keycode == '13') {
                    // let value = 3090054569;
                    var value = $('#serial').val();
                    // validar DN
                    validarDn(value)
                        .then(isValid => {
                            if (isValid) {
                                limpiarTabla();
                                limpiarGlobales();
                                $('#scanSerial').modal('show');
                            }
                        })
                        .catch();
              }
            });

            function validarCodigo(code) {
                return new Promise((resolve, reject) => {
                    $.post('php/buSerial.php',
                    {
                    codigo: code
                    },
                    function(data, status){
                            // let dataParsed = JSON.parse(data);
                            console.log('data: ' + JSON.stringify(data));
                            console.log('currentDn: ' + currentDn);
                            // console.log('dataParsed: ' + dataParsed);

                            if (data.dn == currentDn) {
                                resolve({
                                    isValid: true,
                                    data
                                })
                            }

                            resolve({
                                isValid: false
                            });
                });
                });
            }

            // Decidir si agregar a tabla en modal
            $('#codigo').on('keyup', function checkCode(e) {
                var keycode = (e.keyCode ? e.keyCode : e.which);
                if (keycode == '13') {
                    var code = $('#codigo').val();
                    validarCodigo(code)
                        .then(result => {
                            console.log('result: ' + JSON.stringify(result));
                            if (result.isValid) {
                                console.log('serials: ' + serials);
                                if (!serials.includes(result.data.serial_number)) {
                                    $('#registros').append($('<tr>')
                                    .append($('<td>').append(result.data.id))
                                    .append($('<td>').append( result.data.dn))
                                    .append($('<td>').append( result.data.po ))
                                    .append($('<td>').append( result.data.serial_number ))
                                    .append($('<td>').append( result.data.second ))
                                    .append($('<td>').append( result.data.shiping_sn ))
                                    .append($('<td>').append( result.data.model ))
                                    );
                                    serials.push(result.data.serial_number);
                                    console.log('serials: ' + serials);
                                } else {
                                    document.getElementById('xyz').play();
                                        alert("ERROR Codigo de Serial ya esta Incluido !! ");
                                }
                            }
                        })
                        .catch();
                }
            })

            </script>

database

<?php
// BASE DE DATOS
$host = "localhost";
$dbname = "baseDatos";
$user = "root";
$pass = "";
$conexion = null;
$result = [
    'isValid' => false
];

try {
    $conexion = new PDO("mysql:host=$host; dbname=$dbname", $user, $pass);
} catch (\Exception $e) {
    return json_encode($result);
}

if (!array_key_exists('value', $_POST)) {
    echo json_encode($result);
}

$value = $_POST['value'];

// Consulta 1 en caratulasalida
$sql = "SELECT * FROM caratulasalida WHERE dn = $value";
$stmt = $conexion->prepare($sql);
$r = $stmt->execute();
$row = $stmt->fetchAll(\PDO::FETCH_OBJ);

if (count($row) > 0 && $row[0]->pallet_status == 3) {
    $result['isValid'] = true;
}

// Consulta 2 en planproduccion
$sql = "SELECT * FROM planproduccion WHERE dnProduccion = $value";
$stmt = $conexion->prepare($sql);
$r = $stmt->execute();
$row = $stmt->fetchAll(\PDO::FETCH_OBJ);

if (count($row) == 0) {
    $result['isValid'] = false;
}

// //consulta 3 en caratula para numFrus
// $sql = "SELECT * FROM caratulasalida where costumer_np = $value";
// $stmt = $conexion->prepare($sql);
// $r = $stmt->execute();
// $row = $stmt->fetchAll(\PDO::FETCH_OBJ);
//
// if(count($row) != X){
//  $result['isValid']=false;
// }

$conexion = null;

echo json_encode($result);
?>
    
asked by fokus 15.08.2018 в 23:46
source

1 answer

0

Look at this, try jQuery, it's very easy to do what you want:

//activas un evento al click el boton del modal
$('#infoDN').on('click', function () {
    //capturas el valor del input del modal
    var inputModal = $('codigo').val();
    //seleccionar el input de la tabla y la asignas el valor de la nueva variable
    $('serial').val(inputModal);
});

I hope you sriva, you warn me

    
answered by 15.08.2018 в 23:57