Browse json array in ajax extracted by php

0

I'm new to ajax and javascript. My goal is to extract the value of the input in relation and through ajax send it to php, there by a function that I have with mysqli, I get an array, in the end I use echo json_encode, but I do not know where that part is going, in the end I'm trying that the select, option I see the options of the list that you enter according to the relationship. When I hit the search button, I do not load the list, it seems that my ajax is wrong, the button is out of the form, only that the image does not update it.

    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="last-name">Relacion<span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                          <input type="number" id="relacion" name="txtRelacion" required="required" class="form-control col-md-7 col-xs-12">

                           <script type="text/javascript">
                            $(document).ready(function(){
                              $("#btnB").on('click',function() {
                                var relacion = $("#relacion").val();

                                $.ajax({
                                      // metodo: puede ser POST, GET, etc
                                      method: "POST",
                                      // la URL de donde voy a hacer la petición
                                      url: "listprov.php",
                                      // los datos que voy a enviar
                                      data: { rel: relacion},
                                      datatype : "json",
                                      // si tuvo éxito la petición
                                      success: function(listP) {
                                        var select = $('select[name=cboIdEmpresa]');

                                        select.find().remove().end().appened('<option value="-1">Seleccione el proveedor de Nivel</option>');
                                        for (var i = 0; i < listP.length; i++) {
                                            select.append('<option value="' + listP[i][0] + '">' + listP[i][1] + '</option>');
                                        }
                                        //  for (dato in listP) {
                                        //     alert(dato);
                                        //     select.append('<option value="' + dato[0] + '">' + dato[1] + '</option>');
                                        // } 
                                      }
                                });    
                              });
                            });
                            </script>
                            <label>Proveedor:</label>
                            <select name="cboIdEmpresa" class="form-control">
                              ?>
                              <option value="-1">Seleccione el Proveedor de Nivel </option>   
                            </select> 
                        </div>
                      </div>

<?php
require("header.php");
  include("../Controller/conexion.php");
  include("../Model/Proveedores.php");
  include("../Model/Clientes.php");


    $obj = new Conexion;
    $conexion = $obj->getConexion();


    $objProveedor = new Proveedores($conexion);
    $objCliente    = new Clientes($conexion);


$nivel = $_POST['rel']; 
// echo "<script>alert('$nivel');</script>";
$listP = $objProveedores->ListarPPN($nivel);

// una vez que obtengas los datos, pasas esos en un json_encode()
// esto es para que puedas utilizarlo del lado del cliente
echo json_encode($listP);
?>
    
asked by Luis Fernando Zumaran 03.05.2018 в 19:51
source

2 answers

1

Your variable listP contains the result of your call to the server to the file listprov.php you just have to go through it and go adding the content of the array to the element select , it can be this way .....

success: function(listP) {
  $.each(listP, function(idx, opt) {
    		console.log("estoy recorriendo");
    		//console.log(listP);
    		$('#selectALlenar').append('<option value="' + opt.idValor + '">' + opt.valorADesplegar + '</option>');
	    });
	});                                        
}

Where console.log we use it so that in the console of our browser we are shown the information that contains the array listP (You can open the developer mode with Ctrl+Shift+i )

And #selectALlenar is the id of your element select that you want to be populated with the information extracted from the database

    
answered by 04.05.2018 / 16:21
source
-1
success: function (data)
        {

        $.each(data, function (idx,proveedor)
            {
                select.append($('<option>', {value: proveedor.id, text: proveedor.nombre}));
            });

        }

the id and name according to your fields in the database

    
answered by 03.05.2018 в 20:00