Good morning,
I'm going back to php and javasvript after a long time, and I used jqGrid pluging to create the grids. What I used well, to edit high and modify without problem. I can find the problem when I want to use a table with related data.
The table is the fees of some affiliates, which are related to the affiliates themselves. To edit use the jqgrid form. I tried to put a select, so they choose the affiliate, but I do not load the data. I have given it many laps and I do not know what could be happening to me. To say that I am a little rusty. Sorry if there are very fat failures.
I put my code.
Index.html:
<script type="text/javascript">
$(document).ready(function(){
jQuery("#tblCuotas").jqGrid({
url:'cargaCuotas.php',
editurl: "editCuotas.php",
datatype: 'json',
mtype: 'POST',
colModel:[
{
label: 'ID Cuota',
name: 'idCuota',
index:'idCuota',
width: 50,
key: true,
editable: true,
hidden: true
},
{
label: 'Num. Cuota',
name: 'NumD',
index:'NumD',
width: 50,
editable: true,
editoptions : { required: true, placeholder: "Número de Cuota requieredo"}
},
{
label: 'Num. Afiliado',
name: 'NumAfiliado',
index:'NumAfiliado',
width: 150,
editable: true,
edittype: 'select',
formatter:'select',
editoptions : { dataurl: 'afiliadosSelect.php' },
editrules : { required: true, placeholder: "Número de Cuota Afiliado"}
},
{
label: 'Nombre',
name: 'NOMBRE',
index:'NOMBRE',
width: 300,
editable: true
},
{
label: 'Cuota',
name: 'CUOTA',
index:'CUOTA',
width: 150,
editable: true,
editoptions : { required: true, placeholder: "Importe de la cuota requieredo"}
},
{
label: 'Mes',
name: 'MES',
index:'MES',
width: 120,
editable: true,
editoptions : { }
},
{
label: 'Año',
name: 'ANNO',
index:'ANNO',
width: 50,
editable: true,
editoptions : { }
},
{
label: 'Pago',
name: 'PAGO',
index:'PAGO',
width: 50,
editable: true,
edittype: 'select',
editoptions : { value: "Y:SI;N:NO" }
},
{
label: 'Forma Pago',
name: 'FormaPago',
index:'FormaPago',
width: 100,
editable: true,
editoptions : { }
}
],
loadonce: false,
width: window.innerWidth-20,
height: window.innerHeight-150,
pager: '#paginacion',
rowNum: 50,
rowList:[50,100,150],
sortname: 'NumD',
sortorder: 'asc',
viewrecords: true,
caption: 'CUOTAS'
});
jQuery("#tblCuotas").jqGrid('navGrid','#paginacion',
{edit:true,add:true,del:true},
// options for the Edit Dialog
{
html5Check : true,
editCaption: "The Edit Dialog",
recreateForm: true,
checkOnUpdate : true,
checkOnSubmit : true,
closeAfterEdit: true,
reloadAfterEdit:true,
reloadAfterSubmit:true,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
},
buttons : [
{
side : "right",
text : "Afiliado",
position : "first",
click : function( form, params, event) {
alert("Custom action in search form");
}
}
]
},
// options for the Add Dialog
{
closeAfterAdd: true,
html5Check : true,
recreateForm: true,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
}
},
// options for the Delete Dailog
{
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
}
});
});
</script>
afiliadosSelect.php:
<?php
include "../class/tAfiliados.php";
echo '<script>alert("Custom action in search form");</script>';
$oAfiliado = new tAfiliados(1, 0, 1, 1);
$respuesta = $oAfiliado->selectAfiliados();
echo $respuesta;
?>
tAfiliados.php:
<?php
include 'tMySQL.php';
class tAfiliados
{
public function selectAfiliados()
{
$oMySQL = new tMySQL();
if ($oMySQL->bConnect)
{
$cSQL ="SELECT COUNT(*) AS cuantos FROM afiliados WHERE borrado=0";
$this->fila = $oMySQL->countQuery($cSQL);
$this->cuantos = $this->fila['cuantos'];
$query = "SELECT idAfiliado, NumAfiliado, NOMBRE FROM afiliados WHERE borrado=0 ORDER BY NOMBRE";
$result = $oMySQL->GetQuery($query);
$response ='<select>';
$i=0;
while( $i <= $this->cuantos ) {
$response .= '<option value="'.$result[$i]['NumAfiliado'].'">'.$result[$i]['NOMBRE'].'</option>';
$i++;
}
$response .= '</select>';
}
$oMySQL->Close();
return $response;
}
}
?>
Greetings and many thanks.
Please remove this line from your code:
echo '<script>alert("Custom action in search form");</script>';
This causes problem to load the data. The data should contain only html data and nothing more.
This echo causes the data to fail to load into the grid.
UPDATE:
Sorry, Just now I jhave look at your code. The JavaScript is case sensitive.
Please replace
editoptions : { dataurl: 'afiliadosSelect.php' },
With
editoptions : { dataUrl: 'afiliadosSelect.php' },
UPDATE2
I have prepared a demo with your settings and it works fine. Here is the link. Please check if your path to afiliadosSelect.php is correct in the related toy your file where the grid is. In this case you should get in console a error.