PDA

View Full Version : Problem with two linked Comboboxes in MVC



icebergdelphi
2 Apr 2012, 4:41 PM
Hi,all, ok my question is about two linked comboboxes but with Extjs 4 and using
the MVC enviroment to develop my app.
Ok i've created in my form two comboboxes
1: Estados (States) and two:Municipios(County)
2.- i've created a one function to query or filter my second combobox acording what i selected in my first Combo (State)
All works fine if i dive into Firebug,and if i've selected my first combobox, all my sql query works perfect.
but when i select my second combobox to see what my function query returns, the combo box seems to send a new parameter to my sqlQuery,
so my question is:
why when i select the second combobox, again sends a empty parameter to my sql query?
is due to the controller?
greetings from mexico

Here is my code:
Model Entidad (States):



Ext.define('Mocaci.model.Entidad.Entidad', {
extend: 'Ext.data.Model',
fields: [
{ name: 'IdEstados', type: 'int'},
{ name: 'ClaveEntidad', type: 'int'},
{ name: 'Estados', type: 'string'}
]
});



Model: Municipios (County):


Ext.define('Mocaci.model.Municipios.QryComboMunicipios', {
extend: 'Ext.data.Model',
fields: [
{ name: 'IdMunicipios', type: 'int'},
{ name: 'Municipio', type: 'string'},
{ name: 'IdEstados', type: 'int'}
]

});


Store Entidades (States):


Ext.define('Mocaci.store.Entidad.Entidad', {
extend: 'Ext.data.Store',
model: 'Mocaci.model.Entidad.Entidad',//Llamamos el Modelo Antes Creado
autoSync: true,//Sincronizacion con el Servidor
autoLoad: true, //<--- hace las peticiones al servidor automáticamente
proxy: {
type: 'ajax',
api: { //Declaramos la API y Comienzan en estas lineas las operaciones CRUD
read : "/Mocaci/Php/Entidad/EntidadRead.php",


},

reader: {
type: 'json',
idProperty: 'IdEstados',
successProperty : function()
{
// Alguna Funcion o mensaje que quieras agregar cuando la operacion es exitosa
},
root:'data' //Json_encode root:Datos del Servidor desde desde TCD.php

},
writer:{
encode: true,
writeAllFields: true,//decide si se manda al servidor solamente los campos modificados o todo
type: 'json',
root: 'data'

},
//Mensajes Extras si deseas agregarlos
afterRequest: function (request, success)
{

if (request.action == 'read')
{
//Ext.Msg.alert('Title','Read');
}

else
if (request.action == 'update')
{
//Ext.Msg.alert('Title','Actualizado');
}
},
listeners: {
exception: function(proxy, response, operation){
Ext.MessageBox.show({
title: 'ERROR',
msg: operation.getError(),
icon: Ext.MessageBox.ERROR,
buttons: Ext.Msg.OK
});
}
}

}
});


Store Municipios (County):


Ext.define('Mocaci.store.Municipios.QryComboMunicipios', {
extend: 'Ext.data.Store',
model: 'Mocaci.model.Municipios.QryComboMunicipios',//Llamamos el Modelo Antes Creado
alias:'widget.storeQryComboMunicipios',
proxy: {
type: 'ajax',
url:"/Mocaci/Php/Municipios/QryComboMunicipiosRead.php",
actionMethods:{
read:'POST'
},
reader: {
type: 'json',
idProperty: 'IdMunicipios',
successProperty : function()
{
// Alguna Funcion o mensaje que quieras agregar cuando la operacion es exitosa
},
root:'data' //Json_encode root:Datos del Servidor desde desde TCD.php

}

}
});



My Combos:
Firts Combo States:


{
xtype: 'combobox',
width: 193,
fieldLabel: 'Entidad Federativa',
labelAlign: 'top',
store:'Entidad.Entidad',
triggerAction: 'all',
enableKeyEvents: true,
emptyText: 'Seleccione una Entidad',
displayField: 'Estados',
name: 'IdEstado',
valueField: 'IdEstados',
listeners: {
select: {
fn: function()
{
IdEstadosFiltro=this.getValue();
FiltraComboEstados(IdEstadosFiltro);


}
}
}

},


My second combo Municipios (County):


{
xtype: 'combobox',
width: 193,
id:'ComboMunicipios',
fieldLabel: 'Municipio',
store:'Municipios.QryComboMunicipios',
labelAlign: 'top',
emptyText: 'Seleccione un Municipio',
triggerAction: 'all',
enableKeyEvents: true,
displayField: 'Municipio',
name: 'IdMunicipio',
valueField: 'IdMunicipios',
disabled:true

},


My Function:


function FiltraComboEstados(IdEstadosFiltro)
{

Ext.getCmp('ComboMunicipios').clearValue();
Ext.getCmp('ComboMunicipios').setDisabled();
var MyStoreMunicipios=Ext.widget('storeQryComboMunicipios');
MyStoreMunicipios.load(
{
params:
{
IdEstados:IdEstadosFiltro,
}

});
}




Part of my My Controller:


Ext.define('Mocaci.controller.Ciudadanos.Ciudadanos',{
extend : 'Ext.app.Controller',
stores : ['Ciudadanos.Ciudadanos','Entidad.Entidad','Municipios.QryComboMunicipios'],
models : ['Ciudadanos.Ciudadanos','Entidad.Entidad','Municipios.QryComboMunicipios'],
views : ['Ciudadanos.GrdCiudadanos','Ciudadanos.CapturaEdicionCiudadanos'],

bla
bla
bla




My Sql:


<?php

require '../MocaciDatabase.php';

mysql_select_db($db_name,$connection) or die("Error de conexion a la base de datos");
$id = $_POST['IdEstados'];

$arr = array();
// Llamamos a la Tabla y sus datos
$sql = "select IdMunicipios,Municipio from municipios where IdEstados=$id";

$result = mysql_query($sql,$connection) or die('La consulta fall&oacute;: '.mysql_error());
//Formamos el Array de Datos, si ejecutamos este archivo PHP veremos el array formado
while($obj = mysql_fetch_object($result)) {
$arr[] = $obj;
}
echo '{ metaData: { "root": "data"}';
echo ',"success":true, "data":' . json_encode($arr) . '}';


// Cerramos la conexion a la bd
mysql_close($connection);
?>

vietits
2 Apr 2012, 5:29 PM
Have a try by adding queryMode: 'local' to your second combobox config.

icebergdelphi
2 Apr 2012, 6:19 PM
hi viewtits thanks, yep i've been traying with queryMode:''local' but is the same results, example: if I select my firts combobox Item to query my second combobox, everythings works perfect i can see the results with Json Firebug, but when i select my second combobox to see or populate it with the json results , the second combobox sends again an empty parameter to my sql query, its that to say , the second combobox appears have my
FiltraComboEstados Function,and ths Firebug Json results shows me and error, i think it could be a Bug, because with Extjs 3 i always did the same Fuction to retrive the results to a second combobox, Error:

br /> <b>Notice</b>: Undefined index: IdEstados in <b>C:\xampp\htdocs\Mocaci\Php\Municipios\QryComboMunicipiosRead.php</b> on line <b>8</b><br /> La consulta fall&oacute;: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '' at line 1

icebergdelphi
2 Apr 2012, 7:52 PM
Hi again, finally i found my own solution, i just wrote:
var MyStoreMunicipios= Ext.create('Mocaci.store.Municipios.QryComboMunicipios');
and the i added to the seconcombo store:


{
xtype: 'combobox',
width: 193,
id:'ComboMunicipios',
fieldLabel: 'Municipio',
store:MyStoreMunicipios,
labelAlign: 'top',
emptyText: 'Seleccione un Municipio',
triggerAction: 'all',
enableKeyEvents: true,
displayField: 'Municipio',
name: 'IdMunicipio',
valueField: 'IdMunicipios',
disabled:true,
queryMode: 'local',
typeAhead: true

},


and in my function:


function FiltraComboEstados(IdEstadosFiltro)
{

Ext.getCmp('ComboMunicipios').clearValue();
Ext.getCmp('ComboMunicipios').setDisabled();
MyStoreMunicipios.load(
{
params:
{
IdEstados:IdEstadosFiltro,
}

});
}




Now all just works nice, Thanks.:D