Kod JavaScript z wykorzystaniem jQuery tworzy funkcjonalność kalendarza wydarzeń. Przeanalizujmy jego główne elementy oraz działanie.
Zmienne Globalne
Na początku skrypt definiuje zmienne globalne przechowujące daty rozpoczęcia i zakończenia wydarzenia oraz inne parametry konfiguracyjne. Zmienne te współpracują z pozostałymi funkcjami w skrypcie.
Funkcja MojaOnReady
Funkcja ta inicjalizuje kalendarz po załadowaniu strony. Konfiguruje przyciski oraz pola formularza. Dodatkowo wiąże zdarzenie 'select’ z polem NRIDODN, które automatycznie uzupełnia lokalizację wydarzenia na podstawie wybranej wartości.
Funkcja MojaZapisz
Ta funkcja odpowiada za zapisywanie wydarzeń w kalendarzu. Wykonuje następujące czynności:
- Sprawdza poprawność wprowadzonych dat
- Weryfikuje wymagane pola formularza
- Tworzy polecenie SQL do zapisania wydarzenia w bazie danych
- Wysyła dane do serwera poprzez PageMethods
Funkcja checkAction
Zarządza datami w formularzu wydarzenia. Odpowiada za prawidłowe formatowanie oraz aktualizację pól daty rozpoczęcia i zakończenia wydarzenia. Współpracuje z kontrolkami jqxDateTimeInput.
Funkcja date2string
Przekształca obiekt daty na format tekstowy. Dodaje zera wiodące do jednocyfrowych wartości miesięcy, dni, godzin i minut. Format wynikowy to RRRR-MM-DD GG:MM.
Funkcja querySt
Umożliwia pobieranie parametrów z adresu URL strony. Działa podobnie jak metoda QueryString w C#. Rozdziela parametry i zwraca wartość dla podanego klucza.
Obsługa Błędów
Skrypt zawiera mechanizmy walidacji danych oraz wyświetlania komunikatów o błędach poprzez system tooltipów. Sprawdza między innymi czy data rozpoczęcia nie jest późniejsza niż data zakończenia wydarzenia.
Integracja z Bazą Danych
Skrypt wykorzystuje procedurę składowaną sp_maw_insert_events_calendar do zapisywania wydarzeń w bazie danych. Przygotowuje parametry takie jak identyfikatory, daty, temat, lokalizacja oraz opis wydarzenia.
Działanie skryptu
Funkcja MojaOnReady() inicjalizuje elementy strony po jej załadowaniu. Ustawia nowe zdarzenie kliknięcia dla przycisku „Zapisz” i pobiera parametry z adresu URL, takie jak date_from, date_to i all_day_event. Następnie konfiguruje pola daty za pomocą biblioteki jqxDateTimeInput.
Funkcja MojaZapisz() jest wywoływana przy kliknięciu przycisku „Zapisz”. Sprawdza, czy data rozpoczęcia jest wcześniejsza niż data zakończenia, oraz wykonuje dodatkowe testy. Przygotowuje i wysyła polecenie SQL do serwera w celu zapisania nowego wydarzenia w kalendarzu.
Funkcja checkAction() zarządza wartościami pól daty. Jeśli jest to nowe wydarzenie, ustawia daty na podstawie parametrów z adresu URL. W przeciwnym razie aktualizuje daty na bieżące wartości pól i ponownie konfiguruje elementy jqxDateTimeInput.
Funkcja date2string() konwertuje obiekt Date na formatowany ciąg znaków, który jest następnie używany do ustawiania atrybutów ssvalue pól daty.
Funkcja querySt() pobiera wartość określonego parametru z adresu URL, co jest przydatne do inicjalizowania pól na podstawie danych z URL.
Funkcja ThisOnSucceeded() jest obecnie pusta i przeznaczona do obsługi zdarzenia po pomyślnym zapisaniu danych na serwerze.