E-mail cím formátumának ellenőrzése; Szerkeszthető DIV-kontrol

Mellékelt példa megnyitása előtt szükséges egy ScriptTips nevű virtuális könyvtár létrehozása, mely a példa könyvtárára mutat. Ehhez nyissa meg a mellékelt mappa Tulajdonság ablakát és itt a Webmegosztás lapon engedélyezze a mappa megosztását olvasási és parancsfájlok futtatási jogával.

E-mail cím formai ellenőrzése

Az ilyen, és ehhez hasonló kis ellenőrzéseket sikeresen elvégezhetjük kliens-oldalon. Ekkor nem kell mást tennünk, csak a szerkesztőmezőben megadott karakterláncot alávetni egy vizsgálatnak, melyet a String nevű JavaScript-objektum MATCH metódusával végezhetünk el. A metódus hívásának szintaxisa:

stringObj.match(rgExp);

A stringObj tag egy karakterlánc típusú elem, mely a vizsgálandó e-mail címet tartalmazza.

A rgExp paraméter objektum viszont egy olyan minta, mely tartalmazza azokat a karaktereket, melyek az e-mail cím karakterláncát alkothatják, és azt a formai szabályt, amely az e-mail címet jellemzi. Valahogy így:

felhasználónév@domain.postfix

A WebForm1.aspx lapon megadva az e-mail cím karakterláncát leellenőrizhető, hogy az adott karakterlánc helyes-e formai szempontból. A gomb eseménykezelőjében adtuk meg ezt a kódot:

var goodEmail = document.all["e_mail_text"].value.match(/\b(^(\S+@).+((\.com)|(\.net)|(\.edu)|(\.mil)|(\.gov)|(\.org)|(\..{2,2}))$)\b/gi);

A goodEmail változó eredménye jelzi, hogy megfelel-e az e-mail cím a formai követelményeknek, vagy sem. Ha igen, akkor a navigate metódussal átlinkelünk a WebForm2.aspx lapra.

if (goodEmail)
{
  window.navigate("WebForm2.aspx");
}
...

Szerkeszthető DIV-kontrol

A DIV-kontrolt előszeretettel alkalmazzuk változatos feladatok elvégzésére, mivel igen jól formázható, és rendelkezik néhány, még ennél is fontosabb attribútummal. Ilyen hasznos attribútum a CONTENTEDITABLE attribútum, melynek felhasználásával felruházhatjuk DIV-kontrolunkat a TextArea kontrol tulajdonságával, miszerint szerkeszthetővé válik. Így felhasználható akár arra is, hogy egy szövegszerkesztő szerkesztőmezőjét alakítsuk ki belőle.

Rendelkezik azzal a tulajdonsággal, amivel a TextArea kontrol nem, vagyis hogy megadva benne egy e-mail cím, vagy Web-cím hivatkozást, az rögtön kiemelve, linkként jelenik meg. Ekkor azonban még nem érhető el.

A fent említett attribútum JavaScript-kódból elérhető és állítható, melynek FALSE értéket adva a DIV-kontrol elveszti szerkeszthető tulajdonságát, mely után a linkek elérhetőek.

A feladatban egy gombot találunk a DIV-kontrol fölött, mellyel a CONTENTEDITABLE property (a kontrol deklarációjában attribútum, script-ből property) TRUE értékre állítható, majd a gombot ismételten megnyomva FALSE érték adható neki.

A property TRUE értéke esetén úgy írhatunk a kontrolba, akár egy szövegmezőbe. A kontrol alatt egy Label kontrolon minden karakter beírása után megjelenik a DIV-ben található aktuális tartalom HTML-kódja.

Ezt a doHtml metódusba ágyaztuk:

function doHtml()
{
  document.all["html"].innerText = document.all["editor"].innerHTML;
}

Egy hivatkozást írva a kontrolba, a megfelelő HTML-kód lesz látható, például:

<A HREF=”mailto:..”>...</A>