Listas simples enlazadas jquery Kumbiaphp Spirit beta2

De KumbiaPHP Framework Wiki
Saltar a: navegación, buscar

Listas Enlazadas de tres niveles[editar]

Para nuestro ejemplos vamos a utilizar listas simples [1] con 3 niveles, Regiones, Comunas y Ciudades.

Requerimientos[editar]

  • incluir libreria jquery

Editamos el template activo y adicionamos esta linea, debemos identificar ante todo cual es el template que estamos usando y agregar la libreria, de lo contrario el codigo .js que incluimos mas adelante no funcionara correctamente.

<?php echo Tag::js('jquery/jquery.min'); ?>

Tablas[editar]

#
# Table structure for table 'regiones'
#
# DROP TABLE IF EXISTS regiones;
CREATE TABLE `regiones` (
  `id` int(4) NOT NULL auto_increment,
  `nombre` varchar(100) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=4 DEFAULT CHARSET=latin1;
 
#
# Dumping data for table 'regiones'
#
 
INSERT INTO regiones VALUES (1,'Primera Region');
INSERT INTO regiones VALUES (3,'Tercera Region');
INSERT INTO regiones VALUES (2,'Segunda Region');
 
#
# Table structure for table 'comunas'
#
 
# DROP TABLE IF EXISTS comunas;
CREATE TABLE `comunas` (
  `id` int(4) NOT NULL auto_increment,
  `regiones_id` int(4) NOT NULL,
  `nombre` varchar(100) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=5 DEFAULT CHARSET=latin1;
 
#
# Dumping data for table 'comunas'
#
 
INSERT INTO comunas VALUES (4,3,'Primera Comuna');
INSERT INTO comunas VALUES (3,2,'Primera Comuna');
INSERT INTO comunas VALUES (2,1,'Segunda Comuna');
INSERT INTO comunas VALUES (1,1,'Primera Comuna');
 
#
# Table structure for table 'ciudades'
#
 
# DROP TABLE IF EXISTS ciudades;
CREATE TABLE `ciudades` (
  `id` int(4) NOT NULL auto_increment,
  `comunas_id` int(4) NOT NULL,
  `nombre` varchar(100) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=7 DEFAULT CHARSET=latin1;
 
#
# Dumping data for table 'ciudades'
#
 
INSERT INTO ciudades VALUES (6,3,'Tercera Ciudad');
INSERT INTO ciudades VALUES (5,3,'Segunda Ciudad');
INSERT INTO ciudades VALUES (4,3,'Primera Ciudad');
INSERT INTO ciudades VALUES (3,2,'Segunda Ciudad');
INSERT INTO ciudades VALUES (2,2,'Primera Ciudad');
INSERT INTO ciudades VALUES (1,1,'Primera Ciudad');

Ejemplo[editar]

  • clientes_controller.php

Vamos a trabajar con un controller llamado clientes, acá solo mostrareos los 3 niveles de las listas, nada más, es decir, no vamos a trabajar con el modelo clientes ya que puede ser 'usuarios, proveedores, profesionales, auxiliares, pacientes, etc..', la base siempre es la misma


<?php
/**
 * Carga de Modelos
 */
Load::models('regiones','comunas','ciudades');
class ClientesController extends AppController{
	public function index() {
 
	}
	public function create(){
		$regiones = new Regiones();
		$this->regiones = $regiones->buscar();
		if(Input::hasPost('clientes')){
			//SUBMIT
		}
	}
	public function getComunas(){
		View::response('view'); //nota se manda $regiones_id a la vista de aquí es que sale
		$this->regiones_id=Input::post('regiones_id');
	}
 
	public function getCiudades(){
		View::response('view');
		$this->comunas_id=Input::post('comunas_id');//y de aquí se envia $comunas_id
	}
}
?>
  • Modelo regiones.php
<?php 
class Regiones extends ActiveRecord{
  public function buscar(){
    return $this->find('order: nombre');
  }
}
?>
  • Modelo comunas.php
<?php 
class Comunas extends ActiveRecord{
  public function buscar($regiones_id){
    return $this->find("regiones_id = $regiones_id", 'order: nombre');
  }
}
?>
  • Modelo ciudades.php
<?php 
class Ciudades extends ActiveRecord{
  public function buscar($comunas_id){
    return $this->find("comunas_id = $comunas_id", 'order: nombre');
  }
}
?>
  • Vista create.phtml
<?php View::content(); ?>
<?php echo Form::open(); ?>
<fieldset>
  <legend>Mantenedor de Clientes</legend>
  <ol>
    <li>
      <label>Región</label>
            <?php echo Form::dbSelect('clientes.regiones_id', 'nombre', array('regiones','buscar'), '- seleccione -'); ?>
    </li>
    <li>
      <label>Comuna</label>
        <div id='div_comunas'></div>
    </li>
    <li>
      <label>Ciudad</label>
        <div id='div_ciudades'></div>
    </li>
   </ol>
</fieldset>
<?php echo Form::submit('Agregar');?>
<?php echo Form::close(); ?>
<script type='text/javascript'>
$("#clientes_regiones_id").change(function(){
	var regiones_id 	=	$('#clientes_regiones_id').val();
        $.ajax({
          type: "POST",
          url: "<?php echo PUBLIC_PATH . 'clientes/getComunas/'; ?>",
          data: "regiones_id=" + regiones_id,
          success: function(html){
            $("#div_comunas").html(html);
          }
        });
});
</script>


  • Vista getComunas.phtml
<?php
        echo Form::dbSelect("clientes.comunas_id", 'nombre', array('comunas','buscar',$regiones_id), '- Seleccione -');
?>		
 
<script type='text/javascript'>
$("#clientes_comunas_id").change(function(){
	var comunas_id 	=	$('#clientes_comunas_id').val();
        $.ajax({
          type: "POST",
          url: "<?php echo PUBLIC_PATH . 'clientes/getCiudades/'; ?>",
          data: "comunas_id=" + comunas_id,
          success: function(html){
            $("#div_ciudades").html(html);
          }
        });
});
</script>
  • Vista getCiudades.phtml
<?php
	echo Form::dbSelect('clientes.ciudades_id', 'nombre', array('ciudades', 'buscar', $comunas_id), '- Seleccione -');
?>