Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Problema con Extjs no funcionan Selects dependientes sacando datos de la BD con JSON

 Estas en el tema de Problema con Extjs no funcionan Selects dependientes sacando datos de la BD con JSON en el foro de Frameworks JS en Foros del Web. Hola, muchas gracias por leer mis post, estoy trabajando con el framework de extjs 3.X, y estoy tratando de hacer unos select dependientes uno del ...
  #1 (permalink)  
Antiguo 17/11/2010, 07:48
 
Fecha de Ingreso: diciembre-2008
Ubicación: http://www.solucionesrios.tk/
Mensajes: 413
Antigüedad: 16 años
Puntos: 19
Busqueda Problema con Extjs no funcionan Selects dependientes sacando datos de la BD con JSON
Hola, muchas gracias por leer mis post, estoy trabajando con el framework de extjs 3.X, y estoy tratando de hacer unos select dependientes uno del otro, trayendo datos desde la base de datos usando codificación JSON, sin embargo he estado tratando de fijarme en ejemplos del foro de extjs y ninguno me parece funcionar.

Empece con 2 para ir aprendiendo y luego seguir la cadena.

Lo tengo completo en este foro: http://www.sencha.com/forum/showthre...=combobox+.php

Aqui les copio mi codigo:

Código: 
var paises = new Ext.data.Store({
autoLoad: true,
proxy: new Ext.data.HttpProxy({
url: ‘../JSON/paises.php’,
method: ‘POST’
}),
reader: new Ext.data.JsonReader({
root: ‘dpaises’
}, [
{name: 'cod'},
{name: 'pais'}
])
});
var provincias = new Ext.data.Store({
autoLoad: true,
proxy: new Ext.data.HttpProxy({
url: ‘../JSON/provincias.php’,
method: ‘POST’
}),
reader: new Ext.data.JsonReader({
root: ‘dprovincias’
}, [
{name: 'cod'},
{name: 'codp'},
{name: 'provincia'}
])
});
var seleccion_pais = new Ext.form.ComboBox({
store:paises,
hiddenName:’pais’,
allowBlank:false,
labelStyle: ‘font-weight:bold;’,
triggerAction: ‘all’,
allowBlank:false,
mode:’remote’,
forceSelection:true,
valuefield: ‘cod’,
width:450,
emptyText:’Seleccione País de la Obra…’,
displayField:’pais’,
selectOnFocus:true,
minChars: ’1′,
fieldLabel:’País’,
listeners:{
select:function(obj,record,index){
var dept = Ext.getCmp(‘seleccion_provincia’);
dept.store.loadData(record.data.cod);
}
}
});
var seleccion_provincia = new Ext.form.ComboBox({
fieldLabel:’Provincia’,
hiddenName:’provincia’,
allowBlank:false,
labelStyle: ‘font-weight:bold;’,
id:’seleccion_provincia’,
store: provincias,
triggerAction:’all’,
editable:false,
mode:’remote’,
emptyText:’Seleccione Provincia de la Obra…’,
selectOnFocus:true,
width:450,
valuefield: ‘codp’,
displayField:’provincia’,
minChars: ’1′,
fieldLabel:’Departments’,
});
__________________
http://www.solucionesrios.tk/

Visita mi Web!
  #2 (permalink)  
Antiguo 17/11/2010, 13:26
 
Fecha de Ingreso: diciembre-2008
Ubicación: http://www.solucionesrios.tk/
Mensajes: 413
Antigüedad: 16 años
Puntos: 19
Respuesta: Problema con Extjs no funcionan Selects dependientes sacando datos de la B
Ok, ya lo logre con 2 selects, pero aun me faltan un par mas que no se como realizarlo

Mi Archivo Javascript
Código: 
this.paisesStore = new Ext.data.Store({
				autoLoad: true,
					proxy: new Ext.data.HttpProxy({
			        url: '../JSON/select_anidados.php',
			        method: 'POST'
				}),
				reader: new Ext.data.JsonReader({
				root: 'dpaises'	
				}, [
					{name: 'value'},
					{name: 'label'}
				])
			});
			
			this.provinciasStore = new Ext.data.Store({
				autoLoad: true,
					proxy: new Ext.data.HttpProxy({
			        url: '../JSON/select_anidados.php',
			        method: 'POST'
				}),
				reader: new Ext.data.JsonReader({
				root: 'dprovincias'	
				}, [
					{name: 'value'},
					{name: 'label'}
				])
			});
									
			this.select_pais = new Ext.form.ComboBox({  
			    store: this.paisesStore,  
				id: 'pais',  
				valueField: 'value',  
				width:450,
				displayField: 'label',  
				triggerAction: 'all', 
				labelStyle: 'font-weight:bold;', 
				emptyText: 'Seleccione el País de la Obra...',  
				fieldLabel: 'País'  
			});  
			
			this.select_provincias = new Ext.form.ComboBox({  
				store: this.provinciasStore, 
				width:450, 
				disabled: true,
				id: 'provincia',  
				valueField: 'value',  
				displayField: 'label',  
				triggerAction: 'all',  
				mode: 'local',
				labelStyle: 'font-weight:bold;',  
				emptyText: 'Seleccione un País Primero...',  
				fieldLabel: 'Provincia'  
			}); 
			
			this.select_pais.on('select',function(cmb,record,index){	
				this.select_provincias.enable();
				this.select_provincias.clearValue();
				this.provinciasStore.load({
				params:{
					id:record.get('value')
				}
			});
			},this);
Mi Archivo PHP
Código PHP:
<?php
require_once('../Connections/obras.php');
require_once('../funciones/funciones.php');


mysql_select_db($database_obras, $obras);
$query_Recordset1 = "SELECT codigopais, pais FROM de_paises ORDER BY pais ASC";
$Recordset1 = mysql_query($query_Recordset1, $obras) or die(mysql_error());
$row_Recordset1 = mysql_fetch_assoc($Recordset1);
$totalRows_Recordset1 = mysql_num_rows($Recordset1);

$paises = array();
$provincias = array();

do {
    array_push($paises,array(
            "value"        => $row_Recordset1["codigopais"],
            "label"        => $row_Recordset1["pais"]
        ));
        
    mysql_select_db($database_obras, $obras);
    $query_Recordset2 = "SELECT codigopais, codigoprovincia, provincia FROM de_provincias WHERE codigopais = '".$row_Recordset1["codigopais"]."' ORDER BY provincia ASC";
    $Recordset2 = mysql_query($query_Recordset2, $obras) or die(mysql_error());
    $row_Recordset2 = mysql_fetch_assoc($Recordset2);
    $totalRows_Recordset2 = mysql_num_rows($Recordset2);    
    
    do {
        
        $provincias[$row_Recordset2["codigopais"]][] = array(
            "value"    => $row_Recordset2["codigoprovincia"],
            "label"    => $row_Recordset2["provincia"]
        );
        
    
    } while($row_Recordset2 = mysql_fetch_assoc($Recordset2)); 
    
} while($row_Recordset1 = mysql_fetch_assoc($Recordset1));


$id = isset($_POST['id'])?$_POST['id']:-1;  

if (!empty($provincias[$id])) {
    $respuesta = $provincias[$id];
} else {
    $respuesta = array(
        "value" =>    "No Existen Registros",
        "label" =>    "No Existen Registros"
    );
}
if($id > -1) {
    echo json_encode(  //step 4
        array(
        "success"        => true,
        "dprovincias"    => $respuesta
    ));
}else{  
    echo json_encode(  //step 4
    array(
        "success"    => true,
        "dpaises"    => $paises
    ));
}  

mysql_free_result($Recordset1);
mysql_free_result($Recordset2);

?>
__________________
http://www.solucionesrios.tk/

Visita mi Web!
  #3 (permalink)  
Antiguo 19/11/2010, 15:14
 
Fecha de Ingreso: diciembre-2008
Ubicación: http://www.solucionesrios.tk/
Mensajes: 413
Antigüedad: 16 años
Puntos: 19
Respuesta: Problema con Extjs no funcionan Selects dependientes sacando datos de la B
Luego de varios dias buscando como solventar esto lo puede realizar con el siguiente codigo, espero le sirva a alguien:

Código: 
var datos_select = new Ext.data.Store({ 
				autoLoad: true,
				proxy: new Ext.data.HttpProxy({
			    	url:'../JSON/selects_multiples_car.php', 
		     		method: 'POST', 
			    }),
				reader: new Ext.data.JsonReader({
				root: 'data'
      			}, [
		          {name: 'valor'},
        		  {name: 'etiqueta'}
		      	])
			});
			
					
			
			var codigo_pais_fld = new Ext.form.ComboBox({
				mode: 'local', 
				//disabled:true,
				store: datos_select,
				displayField : 'etiqueta',
				valueField : 'valor',
				forceSelection:true,
        		minChars: '1',
				fieldLabel: 'País',
				labelStyle: 'font-weight:bold;',
				typeAhead: true,
				hiddenName: 'codigo_pais_fld',
				triggerAction: 'all',
				emptyText:'Seleccione País de la Obra...',
				selectOnFocus:true,
				forceSelection :false,
				id:'codpais',
				name:'codpais',
				editable : true,
				autoLoad:true, 
				width:450,
				allowBlank:false,
				selectOnFocus:true
			});	
			
			codigo_pais_fld.on('select',function(cmb,record,index){	
				codigo_provincia_fld.enable();			
				//codigo_provincia_fld.clearValue();		
				datos_select.load({			
				params:{
						id1:record.get('valor')	
					}
				});	
			},this);
			
			var codigo_provincia_fld = new Ext.form.ComboBox({
				mode: 'local', 
				store: datos_select,
				disabled:true, 
				displayField : 'etiqueta',
				valueField : 'valor',
				fieldLabel: 'Provincia',
				typeAhead: true,
				hiddenName: 'codigo_provincia_fld',
				forceSelection:true,
        		minChars: '1',
				triggerAction: 'all',
				emptyText:'Seleccione Provincia...',
				selectOnFocus:true,
				forceSelection :false,
				labelStyle: 'font-weight:bold;',
				id:'codprovincia',
				name:'codprovincia',
				editable : true,
				autoLoad:true, 
				width:450,
				allowBlank:false,
				selectOnFocus:true
			});
			
			codigo_provincia_fld.on('select',function(cmb,record,index){	
				codigo_municipios_fld.enable();			
				//codigo_municipios_fld.clearValue();		
				datos_select.load({			
				params:{
						id2:record.get('valor')	
					}
				});	
			},this);
			
			var codigo_municipios_fld = new Ext.form.ComboBox({
				mode: 'local', 
				store: datos_select,
				displayField : 'etiqueta',
				valueField : 'valor',
				fieldLabel: 'Municipio',
				disabled: 'true',
				forceSelection:true,
        		minChars: '1',
				typeAhead: true,
				hiddenName: 'codigo_municipios_fld',
				triggerAction: 'all',
				labelStyle: 'font-weight:bold;',
				emptyText:'Seleccione Municipio...',
				selectOnFocus:true,
				forceSelection :false,
				id:'codmunicipio',
				name:'codmunicipio',
				editable : true,
				autoLoad:true, 
				width:450,
				allowBlank:false,
				selectOnFocus:true
			});
			
			codigo_municipios_fld.on('select',function(cmb,record,index){	
				
				codigo_parroquias_fld.enable();			
				//codigo_parroquias_fld.clearValue();		
				datos_select.load({			
				params:{
						id3:record.get('valor'),
					}
				});	
			},this);
			
			var codigo_parroquias_fld = new Ext.form.ComboBox({
				mode: 'local', 
				store: datos_select,
				displayField : 'etiqueta',
				valueField : 'valor',
				fieldLabel: 'Parroquia',
				forceSelection:true,
        		minChars: '1',
				typeAhead: true,
				hiddenName: 'codigo_parroquias_fld',
				labelStyle: 'font-weight:bold;',
				triggerAction: 'all',
				emptyText:'Seleccione Parroquia...',
				selectOnFocus:true,
				forceSelection :false,
				disabled: 'true',
				id:'codparroquia',
				name:'codparroquia',
				editable : true,
				autoLoad:true, 
				width:450,
				allowBlank:false,
				selectOnFocus:true
			});
Y este es el codigo en php

Código PHP:
<?php 
require_once('../Connections/obras.php'); 
require_once('../funciones/funciones.php'); 

mysql_select_db($database_obras, $obras);
$query_busqueda = "SELECT DISTINCT * FROM de_paises ORDER BY pais ASC";
$busqueda = mysql_query($query_busqueda, $obras) or die(mysql_error());
$row_busqueda = mysql_fetch_assoc($busqueda);
$totalRows_busqueda = mysql_num_rows($busqueda);

$data = array();

if((empty($_POST['id1'])) and (empty($_POST['id2'])) and (empty($_POST['id3'])) and (empty($_POST['id4'])) and (empty($_POST['id5']))) {
    
    $id = -1;
    
    do {  //step 3
        array_push($data,array(
            "valor"        => $row_busqueda['codigopais'],
            "etiqueta"    => $row_busqueda['pais']
        ));
    } while($row_busqueda = mysql_fetch_assoc($busqueda));

}

if(!empty($_POST['id1'])) {
    
    mysql_select_db($database_obras, $obras);
    $query_busqueda = "SELECT DISTINCT * FROM `de_provincias` WHERE `codigopais` LIKE '".$_POST['id1']."'";
    $busqueda = mysql_query($query_busqueda, $obras) or die(mysql_error());
    $row_busqueda = mysql_fetch_assoc($busqueda);
    $totalRows_busqueda = mysql_num_rows($busqueda);
    
    do {  //step 3
        array_push($data,array(
            "valor"        => $row_busqueda['codigoprovincia'],
            "etiqueta"    => $row_busqueda['provincia']
        ));
    } while($row_busqueda = mysql_fetch_assoc($busqueda));
    
}

if(!empty($_POST['id2'])) {
    
    mysql_select_db($database_obras, $obras);
    $query_busqueda = "SELECT DISTINCT * FROM `de_municipios`WHERE `codigoprovincia` LIKE '".$_POST['id2']."'";
    $busqueda = mysql_query($query_busqueda, $obras) or die(mysql_error());
    $row_busqueda = mysql_fetch_assoc($busqueda);
    $totalRows_busqueda = mysql_num_rows($busqueda);
    
    do {  //step 3
        array_push($data,array(
            "valor"        => $row_busqueda['codigomunicipio'],
            "etiqueta"    => $row_busqueda['municipio']
        ));
    } while($row_busqueda = mysql_fetch_assoc($busqueda));
    
}

if(!empty($_POST['id3'])) {
    
    mysql_select_db($database_obras, $obras);
    $query_busqueda = "SELECT * FROM `de_parroquias` WHERE `codigomunicipio` LIKE '".$_POST['id3']."'";
    $busqueda = mysql_query($query_busqueda, $obras) or die(mysql_error());
    $row_busqueda = mysql_fetch_assoc($busqueda);
    $totalRows_busqueda = mysql_num_rows($busqueda);
    
    do {  //step 3
        array_push($data,array(
            "valor"        => $row_busqueda['codigoparroquia'],
            "etiqueta"    => $row_busqueda['parroquia']
        ));
    } while($row_busqueda = mysql_fetch_assoc($busqueda));
    
}

echo json_encode(  //step 4
    array(
    "success"    => true,
    "data"        => $data
));

mysql_free_result($busqueda);
?>
__________________
http://www.solucionesrios.tk/

Visita mi Web!

Etiquetas: comobox, dependientes, extjs, json, select
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 15:14.