Obtengo los datos por medio de una función en php
Este es mi form y lo muestro desde php:
public function show_search_form()
{
$output .= '
<form class="form" action="crearcotizacion.php?action=por_descripcion" onsubmit="return llenartabla_por_desc();" method="post">
<div class="form-body">
<div class="form-group">
<label for="descripcion">Inserte Descripción O Palabra Clave:</label>
<input type="text" id="descripcion" class="form-control"
placeholder="Descripción" name="descripcion" autocomplete="off">
</div>
<button type="submit" class="btn btn-primary btn-block">
<i class="icon-search"></i> Buscar
</button>
</div>
</form>
';
return $output;
}
Después hago la consulta:
public function select_by_descripcion()
{
$query = "SELECT * from listado_general_01
where Descripcion LIKE '%". $this->postData['descripcion']."%';";
//$params_query = array();
if($rs = $this->sql->select($query, array()))
{
return $rs;
}
else
{
return false;
}
}
En seguida devuelvo la tabla, aún sin el resultado obtenido de mi consulta...
public function show_table_results_descripcion()
{
$output .= '
<div class="table-responsive" style="max-height:400px;" id="areaImprimir">
<div class="card-block">
<p>Resultados Totales: <strong>';
foreach ($this->count_by_descripcion() as $value)
{
$output .= $value['total_result'];
}
$output .= '
</strong>
</p>
</div>
<table class="table table-bordered table-hover mb-0 thead-inverse" id="tabla">
<thead>
<tr>
<th># Parte</th>
<th>Descripción</th>
<th>Precio</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
';
$output .= '
<script>
var datos = [';
foreach ($this->select_by_descripcion() as $value)
{
$output .= '
'.(json_encode($value)).'
';
}
$output .= '
];
</script>';
return $output;
}
Y enseguida mi función de javascript, que es aquí donde radica el problema...
function llenartabla_por_desc(datos) {
event.preventDefault();
var descripcion = document.getElementById('descripcion').value;
var data_send = 'descripcion='+descripcion;
event.preventDefault();
$.ajax({
url: '?action=por_descripcion',
type: 'POST',
data: data_send,
success:function(resp){
var d = '<tr>'+
'<th># Parte</th>'+
'<th>Descripción</th>'+
'<th>Precio</th>'+
'</tr>';
for (var i = 1; i < datos.length; i++)
{
d+= '<tr>'+
'<td>'+datos[i].id+'</td>'+
'<td>'+datos[i].Descripcion+'</td>'+
'<td>'+datos[i].Precio+'</td>'+
'</tr>';
}
$("#tabla").append(d);
}
})
return false;
}
El Error que me arroja es: Uncaught TypeError: Cannot read property 'length' of undefined En esta linea...
for (var i = 1; i < datos.length; i++)
Lo que quiero lograr es pintar la tabla de resultados tal y como si fuera un datagridview en c#, usando javascript para no generar un link extra con la variable "action" de php
success
que has llamadoresp
. Por lo que seríaresp.length
yresp[i].id
etc... A no ser que como comenta VickMuñoz la variabledatos
este declarada e iniciada antes delajax
en un sitio que no vemos.