niedziałające checkboxy przy masowych akcjach

Niedziałające pola wyboru przy operacjach masowych uniemożliwiają zastosowanie akcji do wielu rekordów naraz.

Rola pól wyboru w operacjach masowych

Niedziałające checkboxy przy masowych akcjach to problem interfejsu, w którym pola wyboru mają wskazywać rekordy przeznaczone do wspólnego przetworzenia. Rekordem może być wiadomość, plik, zadanie, wpis w tabeli albo element listy administracyjnej. Zaznaczenie kilku pól powinno utworzyć jednoznaczny zestaw identyfikatorów, który następnie zostanie przekazany do przycisku lub menu akcji, takiego jak usuwanie, przenoszenie, archiwizowanie albo zmiana statusu.

W dokumencie HTML checkbox jest zwykle elementem <input type="checkbox">. Jego stan jest opisany między innymi właściwością checked, a możliwość użycia można ograniczyć właściwością disabled. Samo wyświetlenie kwadratu wyboru nie oznacza jeszcze, że aplikacja poprawnie odczytuje jego stan. Skuteczna operacja masowa wymaga zgodności kilku elementów: pola w interfejsie, obsługi zdarzenia po stronie JavaScript, mechanizmu budowania listy zaznaczonych rekordów oraz procedury wysyłającej żądanie do aplikacji.

Dlaczego kliknięcie nie zmienia stanu checkboxa

Jedną z przyczyn jest nałożenie na pole niewidocznego elementu interfejsu. Warstwa zbudowana z elementu div, etykiety albo komponentu biblioteki CSS może przejmować kliknięcie, dlatego użytkownik widzi checkbox, ale zdarzenie trafia do innego obiektu. Podobny efekt występuje po zastosowaniu właściwości CSS pointer-events: none lub po ustawieniu nieprawidłowego indeksu warstwy przez z-index. Wtedy problem może dotyczyć wyłącznie określonego widoku, szerokości okna albo wersji stylów ładowanej przez przeglądarkę.

Checkbox może również pozostawać nieaktywny z powodu atrybutu disabled dodanego statycznie w HTML albo ustawionego dynamicznie przez skrypt. W aplikacjach korzystających z tabel i list często występuje osobny checkbox nagłówka, który ma zaznaczać wszystkie widoczne rekordy. Błąd w selektorze CSS lub JavaScript może sprawić, że skrypt wyszukuje elementy o innej klasie, innym atrybucie name albo innym identyfikatorze. W takiej sytuacji kliknięcie pojedynczego pola może działać, ale zaznaczenie zbiorcze albo przycisk akcji pozostaje nieaktywne.

Nieprawidłowe działanie może wynikać także z błędu JavaScript zatrzymującego dalsze wykonywanie kodu. W konsoli deweloperskiej przeglądarki mogą wtedy pojawić się wyjątki związane z odczytem nieistniejącego elementu, konfliktem bibliotek albo próbą użycia funkcji przed załadowaniem komponentu. W aplikacjach częściowo renderowanych po stronie serwera dodatkowym źródłem problemu jest ponowne wygenerowanie tabeli po filtrowaniu lub stronicowaniu. Nowe checkboxy nie zawsze otrzymują wcześniej zarejestrowane procedury obsługi zdarzeń.

Rozdzielenie zaznaczenia widocznego od zaznaczenia danych

Ważne jest ustalenie, czy akcja ma obejmować wyłącznie rekordy widoczne na bieżącej stronie, czy również elementy znajdujące się na innych stronach wyników. Checkbox nagłówka może zaznaczać tylko elementy obecne w aktualnym fragmencie dokumentu DOM, nawet jeśli użytkownik interpretuje go jako wybór całego zbioru wyników. Przy paginacji, filtrowaniu i wirtualnym przewijaniu część rekordów może nie być jednocześnie obecna w przeglądarce. Sama liczba wizualnie zaznaczonych pól nie musi więc odpowiadać liczbie rekordów przekazanych do operacji.

Przy diagnozowaniu należy sprawdzić, czy zaznaczenie zmienia właściwość checked, czy zmienia się licznik wybranych elementów oraz czy przycisk akcji otrzymuje oczekiwany stan aktywności. Następnie trzeba ustalić, jakie dane są wysyłane: pojedyncze wartości pól formularza, tablica identyfikatorów w żądaniu asynchronicznym czy dane zapisane w stanie komponentu. Błąd może pojawiać się dopiero na tym etapie, na przykład wtedy, gdy checkbox nie ma atrybutu value, kilka pól ma ten sam identyfikator albo skrypt odczytuje etykietę zamiast technicznego identyfikatora rekordu.

Serwer powinien ponownie zweryfikować otrzymaną listę identyfikatorów, uprawnienia użytkownika i aktualny stan rekordów. Interfejs nie może być jedynym miejscem kontroli, ponieważ żądanie można wysłać niezależnie od widocznego stanu przycisku. Jeżeli akcja kończy się komunikatem o braku zaznaczonych elementów, mimo że pola są zaznaczone, warto porównać zawartość żądania w narzędziach deweloperskich z identyfikatorami obecnymi w odpowiedzi aplikacji. Pozwala to rozdzielić błąd prezentacji od błędu logiki danych.

Zakres serwisowej diagnozy problemu z listą rekordów

Praktyczna diagnostyka obejmuje odtworzenie problemu w tej samej przeglądarce, na tej samej stronie i przy tych samych filtrach, a następnie porównanie zachowania w nowej karcie lub w trybie prywatnym. Należy sprawdzić ładowanie arkuszy stylów i skryptów, błędy w konsoli, reakcję na kliknięcie etykiety pola oraz zachowanie po przejściu między stronami tabeli. Jeżeli checkbox działa po wyłączeniu rozszerzeń przeglądarki, przyczyną może być modyfikacja strony przez dodatkowy skrypt, a nie uszkodzenie samej aplikacji.

W przypadku laptopa lub komputera PC serwis może również ocenić, czy problem nie jest związany z ogólnym działaniem przeglądarki: uszkodzonym profilem użytkownika, nieaktualnym komponentem, błędną pamięcią podręczną albo niestabilnym rozszerzeniem. Warszawskie Pogotowie Komputerowe zajmuje się profesjonalną naprawą laptopów i komputerów PC, w tym diagnostyką problemów z oprogramowaniem używanym do pracy z aplikacjami internetowymi.

Naprawa zależy od ustalonej przyczyny. Przy błędzie strony internetowej potrzebna może być korekta selektora, obsługi zdarzeń, synchronizacji stanu lub przekazywania identyfikatorów do żądania. Przy problemie lokalnym rozwiązaniem może być odtworzenie prawidłowej konfiguracji przeglądarki, usunięcie konfliktu rozszerzeń albo naprawa składników systemu odpowiedzialnych za uruchamianie aplikacji. Każdy z tych przypadków wymaga oddzielnego potwierdzenia, ponieważ identyczny objaw — brak możliwości zaznaczenia pól — może wynikać z różnych warstw działania komputera i aplikacji.