.png "Centrum Skryptóe - Systemy Operacyne")
Jak utworzyć samoaktualizujące się pole tekstowe w aplikacji HTA?
.png "Udostępnij na: Facebook")
Skrypciarze odpowiadają na Wasze pytania
Witamy w rubryce TechNet, w której Skrypciarze z firmy Microsoft odpowiadają na częste pytania dotyczące używania skryptów w administracji systemu. Jeśli macie jakieś pytania z tej dziedziny, zachęcamy do wysłania e-maila na adres: scripter@microsoft.com. Nie możemy zagwarantować odpowiedzi na każde otrzymane pytanie, ale staramy się jak możemy. |
.gif "Cześć Skrypciarze!")
Jak utworzyć samoaktualizujące się pole tekstowe w aplikacji HTA?
.jpg "Cześć Skrypciarze! Pytanie")
Cześć, Skrypciarze! Mam aplikację HTA, która zawiera trzy pola tekstowe. W pierwsze wpisuje się imię, natomiast w drugie nazwisko danej osoby. Chciałbym, żeby trzecie pole tekstowe aktualizowało się automatycznie w zależności od zawartości pozostałych dwóch pól tekstowych. Na przykład, jeżeli w pierwszym polu wpiszę Ken, to w trzecim polu powinno pojawić mi się automatycznie Ken. Jeżeli natomiast w drugie pole tekstowe wpiszę nazwisko Myer, to chcę, aby w trzecim polu pokazało się automatycznie Ken Myer. Jak to zrobić?
-- MH
.jpg "Cześć Skrypciarze! Odpowiedź")
Cześć, MH! Nie wiem czy wiesz, ale najczęstszym pytaniem, jakie otrzymujemy od czytelników jest „Czy możecie nam przybliżyć historię Barcelony?” Odpowiedzi nigdy nie drukowaliśmy na łamach, bo przecież ani Barcelony, ani jej historii nie da się przybliżyć – jest na starym kontynencie, a to bardzo daleko… Teraz zadecydowaliśmy zmienić strategię i w celach badawczych udać się właśnie do Barcelony –będziemy mogli więc powiedzieć czytelnikom co nieco na jej temat. Konferencja TechEd IT Forum była oczywiście tylko pretekstem, żeby otrzymać jakieś fundusze na naszą wyprawę… Czekamy więc na kolejne zapytania, najbardziej polecamy takie typu „Cześć, Skrypciarze, czy nie wiecie na przykład, czy ładnie jest w Malezji?”. Pytania mogą też dotyczyć Islandii tudzież Dominikany (tam właśnie na wakacje chce jechać Skrypciarska Matka).
Równie dobrym pytaniem jest oczywiście: „jak napisać skrypt, który aktualizuje automatycznie pole tekstowe w aplikacji HTML (HTA)?” Żeby na nie odpowiedzieć, nie musimy nawet wyjeżdżać:
<html>
<head>
<title>Self-Updating Text Box</title>
</head>
<SCRIPT Language="VBScript">
Sub SetFullName
CombinedName.Value = FirstName.Value & " " & LastName.Value
End Sub
</SCRIPT>
<body>
<input type="text" name="FirstName" size="25" onChange="SetFullName">
<input type="text" name="LastName" size="25" onChange="SetFullName">
<input type="text" name="CombinedName" size="51" readOnly=True>
</body
Zobaczmy teraz, jak działa nasz skrypt. Tak jak w większości aplikacji HTA, mamy tu dwie sekcje: a mianowicie sekcję <BODY> (czyli miejsce, gdzie umieszczamy wszystkie formanty), oraz sekcję <SCRIPT> (czyli, jak się domyślacie – to miejsce, w którym umieszczamy wszystkie skrypty). Dla naszych celów pokazowych sekcja <BODY> będzie mało rozbudowana – będzie składała się z zaledwie trzech pól tekstowych (pierwsze o nazwie FirstName, gdzie umieścimy imię, drugie, w którym umieścimy nazwisko – LastName, oraz CombinedName – czyli cała nazwa danego użytkownika):
<input type="text" name="FirstName" size="25" onChange="SetFullName">
<input type="text" name="LastName" size="25" onChange="SetFullName">
<input type="text" name="CombinedName" size="51" readOnly=True>
Tagi HTML dla dwojga pierwszych pól (FirstName oraz LastName) są bardzo podobne. Mamy tu tag <input> , który zawiera parametr type="text", czyli parametr, który rozróżnia pole tekstowe od innych formantów (typu przycisk, pole wyboru czy przycisk radiowy). Mamy również parametr name (po którym następuje nazwa, którą nadano temu, i tylko temu polu tekstowemu), oraz parametr size (który określa nam szerokość danego pola tekstowego – w tym przypadku 25 znaków).
Występuje tu jeszcze jeden ciekawy parametr, a mianowicie onChange="SetFullName". To właśnie dzięki niemu nasze pola tekstowe aktualizują się automatycznie. Za każdym razem, gdy dokonujemy jakiejś zmiany czy to w pierwszym, czy to w drugim polu tekstowym, uruchamia się zdarzenie onChange (a dokładniej – uruchamia się, gdy dokonamy jakiejś zmiany, a pole tekstowe straci fokus). Co stanie się w momencie uruchomienia zdarzenia onChange, przynajmniej dla dwóch pierwszych pól tekstowych naszej HTA? Zgadza się: uruchomimy podprogram SetFullName.
Całkiem możliwe, że zauważyliście, iż trzecie pole tekstowe – CombinedName – nie ma zdarzenia onChange. Dlaczego tak? Dlatego, że nikt nie będzie niczego w to pole wpisywał. To pole tekstowe aktualizuje się automatycznie, na podstawie tego, co zostało wpisane w dwa pierwsze pola tekstowe. Co więcej, dla pewności, żeby nikt nie próbował nawet tam niczego wpisywać, dodaliśmy ponadto parametr readOnly=True, czyli taki, który zadba o to, żeby nasze pole było tylko do odczytu.
Tyle o sekcji <BODY>. Co zaś tyczy się sekcji <SCRIPT>, to zawiera ona pojedynczy podprogram, (SetFullName), który z kolei zawiera pojedynczy wiersz kodu:
CombinedName.Value = Trim(FirstName.Value & " " & LastName.Value)
Przypisujemy tutaj coś do właściwości Value naszego trzeciego pola tekstowego (CombinedName). Co dokładnie przypisujemy? Nic innego, jak tylko wartość pierwszego pola tekstowego (FirstName) , spację, oraz wartość drugiego polka tekstowego (LastName). Następnie używamy funkcji Trim, która usuwa nam wszystkie zbędne spacje na początku i końcu naszej wartości.
Co nam to daje? Załóżmy, że w pierwszym polu tekstowym znajduje się Ken. Kiedy to pole straci fokus (np. kiedy przyciśniemy klawisz Tab lub klikniemy poza tym polem), uruchomi się zdarzenie onChange i trzecie pole tekstowe będzie wyglądać w następujący sposób:
Ken
Dlaczego Ken, a nie np. Barbie? Ponieważ jest to wartość pierwszego pola plus spacja plus wartość drugiego pola tekstowego (które obecnie jest puste). Gdyby nie funkcja Trim, nasz zapis wyglądałby tak: Ken_ (z podkreślnikiem, który oznacza tu znak spacji). Funkcja Trim usuwa wszystkie zbędne spacje poprzedzające nazwę i znajdujące się za nią.
Teraz wyobraźcie sobie, ze w drugie pole wpiszemy Myer. Teraz spróbujcie odgadnąć czemu teraz będzie równało się trzecie pole…
Brawa dla tych, którzy odgadli, że właśnie tak:
Ken Myer
Jeśli teraz odwidzi nam się Ken i wpiszemy Kenneth w pierwszym polu, to pole trzecie automatycznie zmieni się na:
Kenneth Myer
Itp., itd…
Barcelona swoją drogą jest piękna, polecam ulicę Ramblas, bazylikę Sagrada Familia i wiele innych atrakcji… no i oczywiście czekam na kolejne pytania dotyczące różnych innych ciekawych miast. Chętnie odwiedzę i udzielę równie wyczerpujących relacji.
.gif){kind=icon} Do początku strony |