Visualizzazione dei risultati da 1 a 6 su 6

Discussione: Layout autocomplete

  1. #1
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    34

    Layout autocomplete

    Ciao a tutti, sto lavorando con l'autocomplete di jquery.
    Praticamente ho un input text in cui vado a inserire il nome dell'utente e nei suggerimenti voglio che appaiano l'immagine associata all'utente il nome e il cognome.

    La struttura deve essere la seguente: a sinistra l'immagine e a destra il nome e appena sotto i cognome.

    In html scriverei semplicemente così:
    codice:
    <div>
    	<div style="float:left">[img]immagine[/img]</div>
    	<div style="float:left">
    		
    
    Nome</p>
    		
    
    cognome</p>
    	</div>
    	<div style="clear:both"></div>
    </div>
    Ma qui mi ritrovo uno script di questo tipo e magari esistono modi più intelligenti:
    codice:
    $(function()
     {
      $("#textarea_share_input").autocomplete({
        search: function(event, ui) {
            $('.autocomplete_div ul').empty();
        },
      	source: "add_user_group.php",
      })
      .data( "autocomplete" )._renderItem = function( ul, item ) {
    	return $("<li class='autocomplete_li'>")
    	.data("item.autocomplete", item)
    	.append("<a>"+item.label+"
    <span>"+item.desc+"</span></a>")
    	.appendTo($('.autocomplete_div ul'));
      };
     });
    Le mie variabili sono:
    item.label che contiene il nome
    item.desc che contiene il cognome
    item.img che contiene già il tag img

    Avete qualche dritta?

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    E il problema sarebbe?
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    34
    Effettivamente nessuno, pensavo bisognasse usare particolari accorgimenti per inserire il mio layout. Ma mi sbagliavo.

    Vi faccio ancora una domanda, come si fa a chiudere il blocco con i suggerimenti? Il mio resta sempre aperto. Vorrei legare l'evento al click su un pulsante, ma non capisco come...

  4. #4
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Se resta aperto c'è un errore, verifica la console
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  5. #5
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    34
    No, non mi da nessun errore. Può dipende dalla mia scrittura del codice?

    codice:
    <script type="text/javascript">
    $(function()
     {
      $("#textarea_share_input").autocomplete({
        search: function(event, ui) {$('#autocomplete_div ul').empty();},
        minLenght: 1,
      	source: "http://www.worldtechitalia.it/system/div_refresh/add_user_group.php",
      })
      .data("autocomplete")._renderItem = function( ul, item ) {
      
        //if(document.getElementById("autocomplete_div").style.display == "none")
         /*{document.getElementById("autocomplete_div").style.display = "block";}*/
        
        var inner_html = "<a><div class='autocomplete_image'>"+item.image+"</div><div>"+item.label+"</div>
    
    "+item.desc+"</p></a><div style='clear:both'></div>";
    	return $("<li class='autocomplete_li'>")
    	.data("item.autocomplete", item)
    	.append(inner_html)
    	.appendTo($('#autocomplete_div ul'));
      };
     });
    </script>
    
    <div id='textarea_share'>
      <div id='textarea_share_l'><input type='text' id='textarea_share_input'/></div>
    </div>
    <div id='autocomplete_div'><ul class='autocomplete_ul'>[/list]</div>

  6. #6
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    dato che sul sito ufficiale si chiude il problema è tuo, eseguire il debug è una operazione togli le aggiunte e verifica se il problema è li
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.