Msaada: Kuweka form validation kwa kutumia JavaScript

Msaada: Kuweka form validation kwa kutumia JavaScript

Joined
Jul 21, 2022
Posts
41
Reaction score
61
Nina uelewa mpana kidogo juu ya html na CSS ila ni mgeni kweny js na php

Kweny practice zangu upande wa forms hua natumia attribute ya required ili kufanya validation lakin naona kama sio unyama saana maana nataka n create alert yangu mwenyew pale form inapo fanyiwa submit pasipo kujazwa baadhi ya field

Naombeni muongozo wenu aseee
NB: am beginner on this issue


Nawasilisha🙏🏽
 
Nina uelewa mpana kidogo juu ya html na CSS ila ni mgeni kweny js na php

Kweny practice zangu upande wa forms hua natumia attribute ya required ili kufanya validation lakin naona kama sio unyama saana maana nataka n create alert yangu mwenyew pale form inapo fanyiwa submit pasipo kujazwa baadhi ya field

Naombeni muongozo wenu aseee
NB: am beginner on this issue


Nawasilisha🙏🏽
Njia ni nyingi, unaweza tengeneza error na success message kwa php kisha utaload as json object wakati unapo send request by using Ajax.




Njia nyingine tumia library special for validation Kama vile jQuery validate, formvalidator, parsley etc


Note: validate both side kwenye server na client
 
Nina uelewa mpana kidogo juu ya html na CSS ila ni mgeni kweny js na php

Kweny practice zangu upande wa forms hua natumia attribute ya required ili kufanya validation lakin naona kama sio unyama saana maana nataka n create alert yangu mwenyew pale form inapo fanyiwa submit pasipo kujazwa baadhi ya field

Naombeni muongozo wenu aseee
NB: am beginner on this issue


Nawasilisha🙏🏽


 
Ipe input class au id name
Kwenye JavaScript select iyo class au id
Mfano

//class
Const inputName = document.Queryselector('.inputName');

//id
Const inputName = document.Queryselector('#inputName');

function colorWarning() {
//value ya name isipomatch a-z au 0-9 au _ add class ya active
ambayo utaistyle kwa CSS

if (!inputName.value.match(/^[a-zA-Z0-9_]*$/)) {
inputName.classList.add("active");
}else {
inputName.classList.remove("active");
}
}

Weka border kuwa red jina linapo contain special characters kama %
CSS:
.inputName.active {
border: solid red 3px;
}

//Kwenye onkeyup weka function yako. User akitoa kidole kwenye key aliobonyeza function inaangalia kama
name lipo sahihi.

<input onkeyup="colorWarning()" type="text" class="inputName" placeholder="Ingiza jina lako" required>
 

Similar Discussions

Back
Top Bottom