jQueryUI: butoane şi autocompletare


Cum în ultima vreme am intrat mai des pe pagina dedicată elementelor vizuale pentru jQuery (biblioteca jQueryUI – unde UI vine de la user interface), am constatat recent apariţia a două elemente marcate cu New! Unul pentru autocompletări, iar altul pentru butoane. Dacă vă amintiţi, chiar recent am scris despre pluginuri jQuery pentru aspectul formularelor. Iată că acum avem ceva nativ jQuery! Iar vizual arată bine… doar că nu se vor potrivi chiar la orice sit (şi nu mă refer la culori, căci cu Theme Roller poţi să ţi le faci exact cum doreşti, ci mă refer la combinaţia aspect-funcţionalitate).

imagine

Demonstraţiile pentru butoane le găsiţi aici. Dacă la butoanele propriu-zise (ex: pentru submit) nu e mare surpriză, opţiunea pentru butoane radio şi checkbox e mai originală, şi, după cum tocmai spuneam, nu mereu adaptabilă. După cum vedeţi din captura de mai sus, butoanele radio şi checkbox apar ca nişte butoane obişnuite (adio cerculeţ sau pătrăţel de bifat) cu stări (apăsat, neapăsat). Partea frumoasă este că se pot construi butoane cu sau fără imagini (în stânga, în dreapta sau în ambele părţi) care să fie “montate” apoi în bări de instrumente (toolbar). Pentru butoane radio şi checkbox e nevoie de “înconjurarea” într-un div pe care să se apeleze buttonset(), dar cei interesaţi vor vedea detaliile dând click pe View Source.

Cât despre autocompletare, nu am testat-o încă (butoanele le folosesc deja într-un proiect). Găsiţi demonstraţiile aici. Simplitatea e din nou de apreciat (pun un scurt cod mai jos spre exemplificare). Bineînţeles că autocompletarea se poate “alimenta” din surse locale şi externe, există şi mecanism de cache şi altele. Sună interesant şi probabil voi încerca să folosesc această opţiune. Pe de altă parte nu mă grăbesc, să se maturizeze :) , pentru că ceea ce folosesc acum mi-e suficient. Dar e mai simplu să incluzi o singură bibliotecă pentru efecte, decât n din m surse, unele care se actualizează, altele care nu.

[HTML]<script type="text/javascript">
$(function() {
var availableTags = ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl"];
$("#tags").autocomplete({
source: availableTags
});
});
</script>

<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags" />
</div>[/HTML]

Mă bucur de aceste noutăţi – de aceea am ţinut să vi le semnalez – şi sper sincer să vedem un jQueryUI tot mai solid şi mai plin de facilităţi (ex: pentru meniuri).


Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (2 evaluări, media: 5,00 din 5)
Loading...Loading...

0 comentarii


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *