Az űrlapok kitöltése jquery-vel, Kostanovich Stepan blogjával

Az űrlapok kitöltése a jQuery segítségével

Az ügyfél kérte az űrlapmezőket, hogy újabb ellenőrzést hajtsanak végre az űrlap-ellenőrzés végrehajtásához, hogy a felhasználók ne tudják elküldeni őket. Mindez egyszerű módszerrel végezhető el a HTML5-ös mezők ellenőrzésével. De ez a módszer nem felel meg nekem.

Elkezdtem gondolkodni ebben a kérdésben, és a döntés jött! Ellenőrizheti, hogy kitölti-e az űrlapmezőket a JQuery Validation használatával. Ez a módszer bármely motoron, helyszínen stb. Használható.
Tehát a JQuery Validation plugin ellenőrzi az Ön által létrehozott szabályok űrlapmezőit, és ha nincs egyezés, akkor megjeleníti azokat a dinamikus hibákat, amelyeket a felhasználó az űrlap kitöltésekor tett.

Kezdjük az űrlap létrehozását.

  1. Hozzon létre egy fájlt az űrlaphoz. Ha van formázott fájl, akkor hagyja el az első bekezdést. Íme, amit az űrlapkód néz ki:
Ügyeljen arra, hogy id = "myform-1". név = "bejelentkezés". name = "jelszó". Ezeket a neveket fogom használni, amikor létrehozom az űrlap érvényesítési szabályait. A saját nevét hívhatja, ha akarja.
  • Az űrlapot tartalmazó fájlhoz csatlakoztassa a JQuery könyvtárat. a JQuery Validation bővítmény és a ".js" kiterjesztésű fájl, ahol saját szabályokat fog írni az űrlap ellenőrzésére.
    Illessze be ezt a kódot a címkék közé :
  • Hozzon létre egy "js" mappát, és hozzon létre egy fájlt "myscriptspravil.js" ezzel a kóddal:

    Leteszünk egy kódot.
    3. tétel.

    A "Myform-1" a formanyomtatvány neve, és itt veszik:

    A szabályokat vesszővel írjuk be a zárójelek között:<>

    A szabályokat vesszővel írjuk a záró jelszó közé:<>

    A kódban, amit minden egyes ponthoz írtam, úgy gondolom, hogy nem lehet probléma.
  • CSS-stílusokat hozhat létre hibákhoz:
  • Egyébként mentheti a JQuery könyvtárat és a JQuery Validation plugint a "js" mappába. Ezután a fájlok elérési útja így lesz:

    Itt található a sablon a szabályok létrehozásához: "myscriptspravil.js":

    szükséges - kötelező mező (igaz vagy hamis)

    dátum - ellenőrizze, hogy a dátum helyes-e (igaz vagy hamis)

    dateISO - ellenőrizze az ISO-dátum helyességét (igaz vagy hamis)

    számjegyek - csak számjegyek (igaz vagy hamis)

    maxlength - a karakterek maximális száma

    hossza - a karakterek minimális száma

    ranghossz - a karakterek száma a (ranglength: [3, 8] -tól)

    tartomány - a számnak a következő tartományon belül kell lennie (tartomány: [12, 20])

    max - a szám maximális értéke

    min a szám minimális értéke

    Itt láthatja a dokumentációt a pluginben és a szabályokat.

    Kapcsolódó cikkek