Zadanie było jasno określone: po dwukrotnym kliknięciu radiobuttona miał się on odznaczać. Czyli miał się zachowywać dokładnie jak checkbox. Po krótkich poszukiwaniach odnalazłem ten plugin - wszystko fajnie, radiobutton się odznacza, ale przy submicie formularza i tak pamiętana jest stara wartość zaznaczonego radiobuttona :/
Zgodnie z zasadą - jeżeli coś ma być zrobione dobrze, zrób to sam - napisałem prosty plugin, który przy dwukrotnym kliknięciu odznacza radiobutton, a przy wysyłaniu formularza usuwa wcześniej nadaną wartość.
/**
* Behave like Checkbox
*
* @autor Hubert Marzec
* @link dzbanyit.pl
*/
(function(){
jQuery.fn.likeCheckbox = function() {
return $(this).each(function(){
$(":radio", this).dblclick(function(){
$(this).clone().hide().val('').insertAfter(this);
});
});
}
})(jQuery);
Jest to najprostsza wersja, bez limitu na liczbę tworzonych klonów- uznałem to za zbędne. A działanie jest bardzo proste, tworzymy klon naszego radiobuttona, ustawiamy pustą wartość, ukrywamy i wstawiamy za oryginalnym obiektem. Testowane pod IE 6,7 oraz FF 2,3.
Tytuł może być trochę mylący. Bo nie jest możliwe przesyłanie plików poprzez XMLHTTPRequest! Wszystkie znane Wam z sieci ajaxowe uploady bazują na pewnych trickach, o których zamierzam opowiedzieć.
IFrame
Tak to ten sam stary dobry IFRAME, kiedy web nie miał jeszcze numerka, a na stronach www rządził kolor szary i niebieskie linki. Minęło trochę czasu i ten znacznik został zapomniany, a nawet wyklęty. Jednak bez ten trick nie będzie mógł działać.
Przepis jest prosty. Formularz z polem input type="file" umieszczamy w pływającej ramce. Kiedy naciśniemy przycisk wyślij - zacznie się uplodowanie pliku, ale wszystkie pięknie w ‘tle’. Można dodać indykator tak, aby użytkownik myślał, że to ajax.
Plusy
- Bardzo proste rozwiązania
Minusy
- Brak paska postępu
- Można uploadować tylko jeden plik naraz
Flash upload
Kolejne rozwiązanie bazuje na flashu i javascript. Cały proces uploadu przechodzi przez ‘niewidzialny’ obiekt flasha. Sposób jest prawie idealny… problem tkwi w tym, że flash uruchamia własną sesje. A to jest dużym problemem (np. autoryzacja). Rozwiązanie tego problemu to przejęcie sesji, w php można to uzyskać poprzez session_id($passedId).
Moim zdaniem najlepsza implementacją uploadu z wykorzystanie flashu jest biblioteka swfupload. Jest napisane w czystym javascripcie, dlatego można ją integrować z dowolnym innych kodem js. Ma sporą społeczność i jest ciągle rozwijana
Plusy
- Można zaznaczyć wiele plików naraz
- Pasek postępu dla każdego pliku
- Wstępna walidacja przed uplodem
Minusy
- tworzy własną sesje
- limit wielkości pliku do 100MB
W jQuery zakochałem się od pierwszego wejrzenia. I była to miłość odwzajemniona. Dzięki tej bibliotece javascript byłem w stanie tworzyć ciekawe efekty oraz dodawać funkcjonalności do stron przy pomocy kilku linijek kodu i małej ilości pracy. Analizując kod pluginów, jak i samej biblioteki doskonaliłem swoje umiejętności programowania w javascripcie, co pozwoliło mi na budowanie bardzo zaawansowanych stron i całych ‘ajaxowych’ portali.
JQuery ma tę samą wspaniała cechę co Zend Framework. Jest tak pięknie zaprojektowana, że można dowolnie modyfikować i rozszerzać. Kolejnym super rozwiązaniem jest zastosowanie fluent interface co bardzo skraca zapis i ułatwia programowanie.
$('a[@href^=http]')
.not('[@href*=www.dzbanyit.pl]')
.addClass('linkexternal');
Filozofie pisania pod jquerowemu, trzeba po prostu poznać i polubić. Dla osób korzystających wcześniej z innych bibliotek, w szczególności Prototype, może to zabrać więcej czasu, ale naprawdę warto.
Główne cechy jQuery:
- Skompresowane jQuery waży tylko 19kb
- Wspiera selektory: CSS 1-3 i XPath
- Działa pod: IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+
Ponieważ nie lubię wynajdywać koła na nowa i tworzył kolejnego kursy ‘podstawy jQuery’, poniżej prezentują wam garść przydatnych linków, a w następnych postach z cyklu jQuery & javascript będę poruszał konkretne tematy i pokazywał rozwiązania realnych problemów.
dfc46656ab49a56e4ca8ff326a124c76
Dodaj mój rss to swojego czytnika.
