JavaScript wizard sablon required input mezők
2021-10-27T09:41:10+02:00
2021-10-27T11:44:42+02:00
2022-08-12T05:15:29+02:00
Gri090807
Sziasztok!

A PHP oldalamban felhasználok egy sablont, amelyben alapból nincsen lekódolva, hogy az input mezők kitöltése nélkül ne lehessen menni a következő oldalra. Ezt szeretném megvalósítani.
Sablon: https://codepen.io/emrankhan016/pen/vdNzXm

Igyekeztem megkeresni azt a változót, függvényt (,bármit), ami tudja, hogy a 3 oldal közül melyiken vagyok éppen. Ha ez meglett volna, akkor szimplán, csak ahhoz rendeletem volna egy ellenőrzést, ami megvizsgálja az input mező értékeit, de nem találtam meg. Ebben szertném a segítségeiteket kérni.

Előre is köszönöm!
Mutasd a teljes hozzászólást!
A next-re kattintáskor ott van a current_fs-ben a fieldset, ami kell. Azon tudsz find-olni inputokat, és tudod őket validálni.

current_fs.find("input").each(function() { console.log($(this)); })
Mutasd a teljes hozzászólást!

  • ;(function($) { "use strict"; //* Form js function verificationForm(){ //jQuery time var current_fs, next_fs, previous_fs; //fieldsets var left, opacity, scale; //fieldset properties which we will animate var animating; //flag to prevent quick multi-click glitches
    Ebből úgy ránézésre a current_fs-t gyanítanám, hogy a jelenlegi fieldsetet tartalmazza :) De mielőtt nagyon beleásod magad, nem akarsz a kliensoldalon semmiféle validációt végezni, ugye? Tehát pl. ha a telefonos megerősítést leimplementálod, azt nem a JS fogja eldönteni, hogy helyes-e a kód, ugye?
    Mutasd a teljes hozzászólást!
  • A telefonos megerősítés számomra nem fog kelleni. Viszont a szerver oldalon már az adatok ellenőrizve vannak. Egyedül annyi kellene, hogy, amíg nem tölti ki az input mezőket a felhasználó, semmiképpen ne engedje tovább a következő oldalra.

    Pl.: amíg az első oldalon nem töltötte ki a telefonszámát, addig disabled legyen a gomb.
    Mutasd a teljes hozzászólást!
  • A next-re kattintáskor ott van a current_fs-ben a fieldset, ami kell. Azon tudsz find-olni inputokat, és tudod őket validálni.

    current_fs.find("input").each(function() { console.log($(this)); })
    Mutasd a teljes hozzászólást!
  • ez egy ilyen állapotgép szösszenet amit az aktuális fielset és a hozzá tartozó back, continue click eseménye vezérel. 

    minden fielset-hez tartozik külön back és continue button. ha rákattintol akkor megkeresi a parent-jét és az az aktuális form: current_fs = $(this).parent();
    ezen belül tudsz keresni inputokat akár "szótárból" vagy használhatod a html input required attributumot szűrésre.
    Mutasd a teljes hozzászólást!
abcd