2010-04-30 11 views
8

La pagina di dimostrazione dell'interfaccia utente JQuery per il completamento automatico (link) ha una casella di ricerca dall'aspetto piacevole e consente di scorrere verso il basso con colori e luci e simili. Quando lo implemento per me stesso, finisco con un elenco puntato. Come posso ottenere la mia lista di suggerimenti per apparire come la loro?Completamento dell'interfaccia utente JQuery visualizzato come punti elenco

A pochi note/frammenti di codice:

  • sto lavorando in terreni .NET, quindi sto usando il tag <asp:ScriptManager> con <asp:ScriptReference> s al suo interno per ottenere i jquery.min.js ospitati (1,4 .2) e file jquery-ui.min.js (1.8.1) di Google.
  • La mia casella di input è abbastanza semplice: <div class='ui-widget'> <label for="terms">Term: </label> <input id="terms" class="ui-autocomplete-input"> </div>
  • mio completamento automatico assomiglia: $(""#terms"").autocomplete({source:""GetAttributesJSON.aspx"",minLength:2});

ottengo i dati corretti di nuovo, in modo che non è questo il problema. Voglio solo una grafica stravagante. Qualsiasi pensiero sarebbe molto apprezzato.

+8

Sei anche il collegamento al file di jQuery UI CSS? – Zack

+0

@awshepard: crea un tema e includilo: http://jqueryui.com/themeroller/ e il problema risolto. Appaiono come pallottole perché senza l'interfaccia utente CSS assomigliano ai tipici LI – karim79

risposta

10

Come hanno menzionato Karim79 e Zack, è necessario modificare l'elenco. Puoi creare il tuo tema e scaricarlo. Ulteriori informazioni possono essere trovate here. Opzionalmente puoi usare uno dei tanti temi precostruiti e includerlo nel tuo documento. Vai al numero Jquery Download Page e seleziona il tema che desideri.

Poi basta includere il file css

<link type="text/css" href="http://yourwebsite.com/css/ui-lightness/jquery-ui-1.8.custom.css" rel="stylesheet" /> 
+0

Aye c'è il problema. Grazie! – awshepard

Problemi correlati