3.3 Integrimi i funksioneve të JavaScript në formularët HTML

Struktura e mësimit 3.3 TIK

    - kupton si të integrojë skriptin JavaScript në formularët HTML;
    - aftësohet në vlerësimin e input-it të përdoruesve duke përdorur JavaScript;
    - ofron feedback bazuar në vlerësimin e inputeve duke përdorur kutinë dialoguese alert().
funksion, vlerësim, formular.
Ndërtoni një formular të ngjashëm me ato që keni hasur në internet ku të kërkohen të dhënat personale. Fushat për emrin dhe mbiemrin nuk duhet të lihen bosh.
Aftësohet në integrimin e funksioneve të JavaScript në formularët HTML.
    1. Cilat janë mënyrat e aksesimit të të dhënave nga një formular?
    2. Ndërtoni një formular regjistrimi që afishon mesazhin: “Urime jeni regjistruar me sukses!”, nëse përdoruesi jep emër përdoruesi dhe fjalëkalim.
    3. Ndërtoni një faqe web, e cila pasi merr një numër nga përdoruesi, afishon nëse ky numër është çift ose tek.
    4. Çfarë realizon funksioni i mëposhtëm. Shkruani kodin për të thirrur funksionin. function ktheCentimetër (gjatësiaMetër) {     return gjatësiaMetër * 100; }
Aksesimi i të dhënave nga një formë

Nëse një dokument në HTML përmban më shumë se një formë, të dhënat e formës mund të aksesohen si document.emër_forme, ku emër_forme është emri i atributit të elementit të formës ose nëpërmjet document.forms[i], ku i merr vlerë 0,1,2,3, etj., dhe document.forms[0] i referohet formës së parë në dokument, dhe document.forms[1] i referohet formës së dytë në dokument e kështu me radhë. Elementet e një forme mund të aksesohen si document.emër_forme.element_forme.

Kontrolli për fusha jo bosh

Fushë boshe nënkupton dy lloje vlerash: një string me gjatësi zero ose një vlerë NULL. Një faqe web me një formë të thjeshtë do të ilustrohej si në figurën më poshtë:

web i thjesht

Kur përdoruesi do të konfirmojë këtë formular, kodi JavaScript do të kontrollojë nëse emri në dritaren dialoguese është plotësuar. Nëse fusha është plotësuar, për shembull me emrin Sindi, faqja web do të shfaqë emrin si në figurën e mëposhtme.

plotesimi i fushes

Nëse përdoruesi dështon në plotësimin e emrit në kutinë dialoguese, skripti do të shfaqë një kuti dialoguese alert() për të treguar që kjo fushë është e detyrueshme.

mesazhi

Në shembullin e mëposhtëm ilustrohet integrimi i funksionit JavaScript në formularët HTML për të kontrolluar plotësimin e fushës emër.

kodi

Vlera e kthimit është shumë e rëndësishme. Kur thirret ngjarja submit ose click dhe funksioni kthen vlerën false, browser-i ndalon procesin e marrjes së të dhënave të formularit. E kundërta ndodh nëse funksioni do të kthejë vlerën true. Shembull: Të ndërtohet një program që kërkon nga përdoruesi një numër dhe verifikon nëse ky numër është midis 1 dhe 100, si më poshtë: Nëse input-i është një numër midis 1 dhe 100 duhet të afishohet mesazhi “Inputi është midis 1 dhe 100”. Në të kundërt të afishohet mesazhi “Inputi nuk është i vlefshëm”.

afishimi

Zgjidhje: Duke qënë se ky formular kërkon një numër, duhet të bëjmë fillimisht një verifikim nëse informacioni që jepet nga përdoruesi nuk është një numër. Kjo realizohet nëpërmjet funksionit isNaN(), pra is Not a Number.

kodi-2