Diferencia entre revisiones de «Autosuggest jQuery KumbiaPHP»

De KumbiaPHP Framework Wiki
(Uso del plugin autoSuggest de Jquery)
 
 
(No se muestran 13 ediciones intermedias de 2 usuarios)
Línea 1: Línea 1:
 +
{{cleanupbox
 +
|image=[[Archivo:Import.png|40px]]
 +
|texto ='''Este Artículo esta siendo revisado por los Kumbieros.'''<br />
 +
<span style="font-size:90%">Puedes tomar la información que aqui se encuentra pero no nos hacemos responsable</span>
 +
}}
 
== '''Librerías''' ==
 
== '''Librerías''' ==
  
Lo primero que se tiene que hacer es bajar la librerías jquery y el plugin en la siguiente dirección [[http://code.drewwilson.com/entry/autosuggest-jquery-plugin.]]
+
Lo primero que se tiene que hacer es descargar el [http://code.drewwilson.com/entry/autosuggest-jquery-plugin plugin de jquery autosuggest].
 
 
Se agregan las librerías en la app de KumbiaPHP.
 
 
 
<source lang="php">
 
 
 
echo stylesheet_link_tag('autoSuggest');
 
echo stylesheet_link_tags();
 
echo javascript_include_tag('jquery');
 
echo javascript_include_tag('jquery.autoSuggest');
 
 
 
</source>
 
  
 
== '''En el Partial''' ==
 
== '''En el Partial''' ==
  
Creamos el Partial donde se va llamar la función autoSuggest, Este Partial va recibir 3 parámetros para así hacerlo mas reutilizable.  
+
Creamos el Partial donde se va llamar la función autoSuggest, Este Partial va recibir 3 parámetros para así hacerlo mas reutilizable, el id del campo, el controlador y la acción.
  
 
<source lang="php">
 
<source lang="php">
 +
<?php
 +
stylesheet_link_tag('autoSuggest');
 +
echo javascript_include_tag('jquery.autoSuggest');
 +
?>
  
 
<script type="text/javascript">
 
<script type="text/javascript">
 
$(document).ready(function () {
 
$(document).ready(function () {
  
  //la url que le pasamos debe ser relativa  
+
   
   $("#<?php echo $id ?>").autoSuggest(data.items, {
+
   $("#<?php echo $id ?>").autoSuggest("<?php echo PUBLIC_PATH."$controlador/$accion"?>", {
 
  minChars: 2,
 
  minChars: 2,
 
  matchCase: true,
 
  matchCase: true,
Línea 75: Línea 73:
 
   $this->set_response('view');
 
   $this->set_response('view');
 
  
 
  
   $input = $_GET["q"];
+
   $input = $this->get("q");
 
  
 
  
 
   $accesorio = new Accesorios();
 
   $accesorio = new Accesorios();
Línea 106: Línea 104:
  
 
</source>
 
</source>
 +
 +
Christopher

Revisión actual del 19:27 16 mar 2010

{{#if:Import.png |}} {{#if: |}}


Librerías[editar]

Lo primero que se tiene que hacer es descargar el plugin de jquery autosuggest.

En el Partial[editar]

Creamos el Partial donde se va llamar la función autoSuggest, Este Partial va recibir 3 parámetros para así hacerlo mas reutilizable, el id del campo, el controlador y la acción.

<?php
stylesheet_link_tag('autoSuggest');
echo javascript_include_tag('jquery.autoSuggest');
?>

<script type="text/javascript">
$(document).ready(function () {

 
  $("#<?php echo $id ?>").autoSuggest("<?php echo PUBLIC_PATH."$controlador/$accion"?>", {
	  	minChars: 2,
	   	matchCase: true,
	   	selectedItemProp: "name",
	   	searchObjProps: "name"	   	
	   
          });
});
</script>

En el Formulario[editar]

En en la vista donde va ir el campo de texto que va usar el plugin agregamos el partial y le asiganmos sus 3 parámetros. el ID del campo, La accion, El controlador.

<?php echo form_tag('registro/create/') //¬¬_ ?>

<table>   
 
   <tr>
        <td>Accesorios</td>
        <td><?php echo text_field_tag('tipoactivo.accesorios') ?></td>        
    </tr>

<tr>
        <td>&nbsp;</td>
        <td><?php echo submit_tag('Agregar') ?></td>         
             
    </tr>

</table>

<?php echo end_form_tag() ?>

<?php View::partial('jquery/autoSuggest', false , array('id'=>'tipoactivo_accesorios','accion'=>'listaracc', 'controlador'=>'registro'))?>


En el Controlador[editar]

public function listaracc(){
  		
  		$this->set_response('view');
  		
  		$input = $this->get("q");
  		
  		$accesorio = new Accesorios();
  		$this->array = $accesorio->find("accesorio like '%$input%'");
  		
  			  		  		  	
	}

En la Vista[editar]

<?php 

$data = array();
  		foreach ($array as $cat) {
  			
    		$json = array();
    		$json['value'] = $cat->id;
    		$json['name'] = $cat->accesorio;
    		$data[] = $json;
  		}
  		
  		header("Content-type: application/json");
		echo json_encode($data);

?>

Christopher