Ulehčete si JavaScript - používejte JQuery

Nedávno jsem dostal v práci naprogramovat trochu složitější a inteligentnější formulář. Nejprve jsem si myslel, že to nakóduji „z fleku“, ale protože jsem před nedávnem dočetl jednu velmi zajímavou knihu o JavaScriptu (John Resig: JavaScript a Ajax), kde se hodně psalo o různých javascriptových knihovnách, které ulehčují práci, rozhodl jsem se, že to také zkusím.

Po chvíli brouzdání na internetu padla volba na JQuery – tedy už před tím brouzdáním jsem měl na něj spadeno, neboť se mi velmi líbil způsob jeho zápisu. Podívejte se na pár ukázek.

Stylové selektory

Pomocí selektorů (jak je znáte z aplikování stylů) naleznete na stránce jakýkoliv element.

$("#myDiv").css("border","3px solid red");

Další operátory viz API reference – oddíl selektory

Řetězení

Jakmile najdete pomocí stylových selektorů objekt, se kterým chcete něco dělat, zavoláte všechny funkce z jednoho řádku:

$("a").addClass("test").show().html("foo");

Přidávání callback funkcí

Obsluha událostí není žádným problémem

$('#myform .textinput').bind("change keydown
keypress keyup click", function(e){ ... });

Toto je jen zlomek, JQuery toho umí mnohem více – má funkce pro práci s DOM, Ajaxem, styly, efekty… ale hlavně má dobrou dokumentaci a spoustu pluginů, které dále rozšiřují množnosti knihovny.

Validace formuláře

Při své práci jsem s úspěchem použil plugin Validation pro kontrolu formuláře. Umožnil mi udělat naprosto vše, co jsem potřeboval, takže jsem měl validaci plně pod kontrolou.

Dále je uveden základní výčet, co plugin Validation umožňuje

• validace navázaná na vlastních prvcích (nikoliv jen na SUBMIT tlačítku)
• validování jen zvolených elementů
• označení povinných políček a formátu vstupu v HTML kódu stránky pomocí css tříd
• vlastní chybové hlášky (globální i pro jednotlivé položky a typy chyb)
• již hotové validátory na datum, číslo, email, web url, číslo kreditní karty
• není problém doplnit vlastní validátory (třeba na datum v určitém formátu)

Pokud s JavaScriptem občas pracujete, věnujte trochu času na prostudování knihovny JQuery, určitě se vám to v budoucnu několikanásobně vrátí.

Nikdy dříve jsem hotové javascriptové knihovny (frameworky) moc nepoužíval. Jak jste na tom vy? Co používáte?