Postgresql y
Jqgrid Parte III Combos Dependientes
Buenos Tardes quiero
agradecer por esta oportunidad para agregar un nuevo avance con el trabajo del
Jqgrid y Postgresql hoy voy a mostrar como:
Combos Dependientes con Jqgrid
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
<link rel="stylesheet" type="text/css" href="scripts/calendar/calendar-blue.css"/>
<link rel="stylesheet" type="text/css" href="css/estilo.css">
<link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.8.16.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript" src="scripts/Nomina.js"></script>
<script language="javascript" src="scripts/sisminalve.js" type="text/javascript"></script>
<script type="text/javascript" src="scripts/calendar/calendar.js"></script>
<script type="text/javascript" src="scripts/calendar/lang/calendar-es.js"></script>
<script type="text/javascript" src="scripts/calendar/calendar-setup.js"></script>
<?php
extract($_POST);
extract($_GET);
include('funciones/Conectar.php');//Conexion a la Base de datos
include('funciones/FuncionesListBox.php');
include('funciones/globales.php');
include('funciones/librerias.php');
?>
<script type="text/javascript">
$(function(){
var identificador_rubro=$('#Renglon_Oculto').val();
// INDICA EL FORMATO NUMERICO PARA EL JQGRID
// $.jgrid.formatter.integer.thousandsSeparator = ',';
$.jgrid.formatter.number.thousandsSeparator = '.';
$.jgrid.formatter.number.decimalSeparator = ',';
$.jgrid.formatter.number.decimalPlaces = 2;
// $.jgrid.formatter.currency.thousandsSeparator = ',';
// RUTINAS PARA LLENAR LOS COMBOS DEL JQGRID (YA EXPLICADAS EN LA PARTE II DEL BLOG
var drubro = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Rubro.php?Id='+identificador_rubro,
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dsistema = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Sistema.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dmedida = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Medida.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dmaterial = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Material.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dtamano = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Tamano.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dmaduracion = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Maduracion.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dcalidad = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Calidad.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dpresentacion = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Presentacion.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
var dempaque = (function () {
var list = null;
$.ajax({
async: false,
global: false,
url: 'Empaque.php',
dataType: 'json',
success: function (data) {
list = data;
}
});
return list;
})();
$("#grps").jqGrid({
//url:'Carga_Datos.php',
datatype: 'json',
mtype: 'GET',
colNames: ['Rubro','Sistema','Medida', 'Material','Cantidad', 'Tamano', 'Maduracion','Calidad','Presentacion','Empaque'],
colModel: [
{ name: 'Rubro', index: 'Rubro', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: drubro},sortable: true},
{ name: 'Sistema', index: 'Sistema', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dsistema,dataEvents: [{type: 'change',
fn: function(e)
{
// RUTINA PARA CREAR LA RELACION EN LOS COMBOS EL CODIGO MEDIDA_FILTRO.PHP SE ENCUENTRA EN LA PARTE FINAL DE LA PAGINA.
$("#grps").setColProp("Medida", {editoptions: { value: dmedida}});
var v = parseInt($(e.target).val(), 10);
$.ajax({
url: "Medida_Filtro.php?Id="+v,
dataType: "html",
success: function(data)
{
if ($(e.target).is(".FormElement"))
{
var form = $(e.target).closest("form.FormGrid");
$("select#Medida.FormElement", form[0]).html(data);
}else{
// inline editing
var row = $(e.target).closest("tr.jqgrow");
var rowId = row.attr("id");
$("select#" + rowId + "_Medida", row[0]).html(data);
}// cierra el if
}// cierra funcion de comprobacion de exito
}); // cierra el ajax
}//cierra funcion e
}]//cierra evento change
}// cierra editoptions
}, // cierra la linea de sistema
{ name: 'Medida', index: 'Medida', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dmedida},sortable: true},
{ name: 'Material', index: 'Material', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dmaterial},sortable: true},
{ name: 'Cantidad', index: 'Cantidad', width: 80, align: 'left',editable: true,editrules:{required:true,number:true},edittype:'text'},
{ name: 'Tamano', index: 'Tamano', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dtamano},sortable: true},
{ name: 'Maduracion', index: 'Maduracion', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dmaduracion},sortable: true},
{ name: 'Calidad', index: 'Calidad', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dcalidad},sortable: true},
{ name: 'Presentacion', index: 'Presentacion', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dpresentacion},sortable: true},
{ name: 'Empaque', index: 'Empaque', width: 80, align: 'left',editable: true,editrules:{required:true},formatter:'select',edittype:"select",editoptions:{value: dempaque},sortable: true},
],
rownumbers:true,
pager: '#pgrps',
rowNum:15,
rowList:[10,25,50,100],
autowidth: true,
viewrecords: true,
width: "98%",
height: "100%",
editurl: "someurl.php",
caption: 'Carga Asientos Contables',
footerrow: true,
cellEdit: true,
cellurl:"otro.php",
});
// MUY IMPORTANTE COLOCAR LA OPCION recreateForm:true
jQuery("#grps").jqGrid('navGrid','#pgrps',{}, //options
{reloadAfterSubmit:false,closeAfterEdit:true,recreateForm:true},// edit
{height:400,width:600,reloadAfterSubmit:false,closeAfterAdd:true,recreateForm:true}, // add options
{reloadAfterSubmit:false}, // del options
{multipleSearch:true,closeAfterSearch: true, closeOnEscape: true}
);
});
</script>
</head>
<body>
<form id="Forma_Solicitud" name="Forma_Solicitud" method="post" action="Solicitud.php">
<div id="Tabla"align="center">
<p> </p>
<table width="900" border="1" align="center" cellpadding="3" cellspacing="0" class="srcTabla">
<tr>
<td colspan="9" align="center" valign="middle" nowrap="nowrap" bgcolor="#ECECEC"><div align="center"><strong>SOLICITUD DE REQUISICION </strong></div></td>
</tr>
<tr>
<td colspan="5"> </td>
<td><strong>Status</strong></td>
<td><div id="Combo_Status" style=" float:left">
<?php LlenarCombo('"Status_decision_Id","Status_decision_Des"', 'Status_decision', 'Seleccione','Status_decision_Id') ?></div></td>
<td width="55"><strong>Fecha:</strong></td>
<td width="124"><input name="fechaR" type="text" id="fechaR" size="12" maxlength="10" value="<?php //echo PERIODO(1); ?>" onkeyup = "this.value=formateafecha(this.value);"/>
<img src="images/calendar.png" alt="Elija una fecha" name="cal_x_fecha_reg1" width="16" height="16" align="bottom" id="cal_x_fecha_reg1" style="cursor:pointer;cursor:hand;" onMouseOver="crearcalendar_d();" /></td>
</tr>
<tr>
<td width="95"><strong>Solicitante:</strong></td>
<td width="100">
<div id="Combo_Solicitante" style=" float:left"><?php LlenarCombo('"Solicitante_Perfil_Id","Solicitante_Perfil_Des"', 'Solicitante_Perfil', 'Seleccione','Solicitante_Perfil_Id') ?></div> </td>
<td width="80"><strong>Unidad
</strong></td>
<td width="91"><span style=" float:left">
<div id="Combo_Unidad" style=" float:left">
<?php LlenarCombo('"Unidad_requerente_Id","Unidad_requerente_Des"', 'Unidad_requerente', 'Seleccione','Unidad_requerente_Id') ?></div>
</span></td>
<td width="128"><strong>Fecha de Solicitud:</strong> </td>
<td width="92"><input name="fecha_Cambio" type="text" id="fecha_Cambio" size="12" maxlength="10" value="<?php //echo PERIODO(1); ?>" onkeyup = "this.value=formateafecha(this.value);"/>
<img src="images/calendar.png" alt="Elija una fecha" name="cal_x_fecha_reg" width="16" height="16" align="bottom" id="cal_x_fecha_reg" style="cursor:pointer;cursor:hand;" onMouseOver="crearcalendar();" /></td>
<td width="61"><strong>Destino</strong></td>
<td colspan="2"><div id="Combo_Destino" style=" float:left"><?php LlenarCombo('"Unidad_requerente_Id","Unidad_requerente_Des"', 'Unidad_requerente', 'Seleccione','Unidad_requerente_Id') ?></div></td>
</tr>
<tr>
<td><strong>Fecha Desde:</strong> </td>
<td><input name="Fecha_Desde" type="text" id="Fecha_Desde" size="12" maxlength="10" value="<?php ?>" onkeyup = "this.value=formateafecha(this.value);"/>
<img src="images/calendar.png" alt="Elija una fecha" name="cal_x_fecha_reg_23" width="16" height="16" align="bottom" id="cal_x_fecha_reg_23" style="cursor:pointer;cursor:hand;" onMouseOver="crearcalendar_Fdesde();" /></td>
<td><strong>Fecha Hasta</strong>: </td>
<td><input name="Fecha_Hasta" type="text" id="Fecha_Hasta" size="12" maxlength="10" value="<?php ?>" onkeyup = "this.value=formateafecha(this.value);"/>
<img src="images/calendar.png" alt="Elija una fecha" name="cal_x_fecha_reg_24" width="16" height="16" align="bottom" id="cal_x_fecha_reg_24" style="cursor:pointer;cursor:hand;" onMouseOver="crearcalendar_Fhasta();" /></td>
<td><strong>Tipo Requision: </strong></td>
<td><div id="Combo_Tipo_Requision" style=" float:left">
<?php LlenarCombo('"Tipo_solicitud_Id","Tipo_solicitud_Des"', 'Tipo_solicitud', 'Seleccione','Tipo_solicitud_Id') ?></div></td>
<td><strong>Renglon:</strong></td>
<td colspan="2"><div id="Combo_Renglon" style=" float:left">
<?php
if ($_POST['Id_Renglon_Oculto']==""){$Mensaje='Seleccione';}else{$Mensaje=$_POST['Id_Renglon_Oculto'];}
LlenarCombo('"Renglon_Id","Renglon_Des"', 'Renglon', $Mensaje,'Renglon_Id') ?></div></td>
</tr>
</table>
<p>
<input type="hidden" name="Renglon_Oculto" Id="Renglon_Oculto" value="<?php echo($_POST['Renglon_Oculto']); ?>" />
<input type="hidden" name="Id_Renglon_Oculto" Id="Id_Renglon_Oculto" value="<?php echo($_POST['Id_Renglon_Oculto']); ?>" />
</p>
</div>
<table id="grps"></table>
<p> </p>
<div id="pgrps"></div>
<div id="boton" align="center">
<input type="BUTTON" id="bedata" value="Grabar Comprobante y Asientos Cargados" />
</div>
</form>
</body>
</html>
*****PROGRAMAS ADICIONALES**************
**MEDIDA_FILTRO.PHP***************
<?php
extract($_POST);
extract($_GET);
require('funciones/Conectar.php');
$id_Unidad=$_GET['Id'];
if($id_Unidad=="")
{
$SQL_Funciones ='SELECT "Unidad_medida_Id","Unidad_medida_Des" FROM "Unidad_medida" ORDER BY "Unidad_medida_Id"';
}else{
$SQL_Funciones ='SELECT "Unidad_medida_Id","Unidad_medida_Des" FROM "Unidad_medida" WHERE "Sistema_Id"='."'".$_GET['Id']."'".' ORDER BY "Unidad_medida_Id"';
}
$Data_Funciones_N = $conn->Execute("$SQL_Funciones");
$Total_Registros=$Data_Funciones_N->RecordCount();
while (!$Data_Funciones_N->EOF)
{
$combo.='<option value="'.$Data_Funciones_N->fields[0].'">'.utf8_encode($Data_Funciones_N->fields[1]).'</option>';
$Data_Funciones_N->MoveNext();
}
$Data_Funciones_N->Close(); //opcional
echo $combo;
?>
No hay comentarios:
Publicar un comentario