Tema: Jquery Objeto clonado
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 21/11/2015, 06:40
MrGilbertMan
 
Fecha de Ingreso: enero-2015
Ubicación: Cordoba, Andalucía
Mensajes: 111
Antigüedad: 9 años, 10 meses
Puntos: 15
Respuesta: Jquery Objeto clonado
Te paso un ejemplo de como lo hice yo

Código Javascript: 
Ver original
  1. /*Aquí hice un array js. Los datos que muestra el autocomplete están en una tabla de mi bd, por lo tanto hice una consulta con php y luego pasé estos resultados a un array js.  La cuestión es que necesitamos partir de un array js.*/
  2.  
  3. var arrayAutocomplete = 
  4.         [
  5.             <?php for($i=0; $i < count ($result); ++$i ){ 
  6.         
  7.                 echo '"'.$result[$i]->product.'", "'.$result[$i]->code.'", ';                       
  8.                     
  9.             } ?>
  10.         ];
  11.  
  12. /* aqui asocia el array con el input text mediante id*/
  13.  
  14. $(document).ready(function(){
  15.     
  16.     $("#autocomplete").autocomplete
  17.     ({
  18.         source: arrayAutocomplete
  19.     });
  20. })

Eso es todo, necesitas cargar la libreria jquery-ui que veo que ya la tienes y un css tipo este.

Código CSS: 
Ver original
  1. /*INICIO AUTOCOMPLETAR*/
  2. .ui-front {
  3.     z-index: 100;
  4. }
  5. .ui-autocomplete {
  6.     position: absolute;
  7.     top: 0;
  8.     left: 0;
  9.     cursor: default;
  10. }
  11. .ui-menu {
  12.     list-style: none;
  13.     padding: 0;
  14.     margin: 0;
  15.     display: block;
  16.     outline: none;
  17. }
  18. .ui-menu .ui-menu {
  19.     position: absolute;
  20. }
  21. .ui-menu .ui-menu-item {
  22.     position: relative;
  23.     margin: 0;
  24.     padding: 3px 1em 3px .4em;
  25.     cursor: pointer;
  26.     min-height: 0; /* support: IE7 */
  27.     /* support: IE10, see #8844 */
  28.     list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  29. }
  30. .ui-menu .ui-state-focus,
  31. .ui-menu .ui-state-active {
  32.     margin: -1px;
  33. }
  34. .ui-widget {
  35.     font-family: Verdana,Arial,sans-serif;
  36.     font-size: 1.1em;
  37. }
  38. .ui-widget-content {
  39.     border: 1px solid #aaaaaa;
  40.     background: #ffffff url("images/ui-bg_flat_75_ffffff_40x100.png") 50% 50% repeat-x;
  41.     color: #222222;
  42. }
  43. .ui-widget-content .ui-state-focus{
  44.     border: 1px solid #999999;
  45.     background: #dadada url("images/ui-bg_glass_75_dadada_1x400.png") 50% 50% repeat-x;
  46.     font-weight: normal;
  47.     color: #212121;
  48. }
  49. /*FIN AUTOCOMPLETAR*/


Espero sea de ayuda, un saludo!