HTML 5 require validácia JavaScript – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

HTML 5 require validácia JavaScript – JavaScript, AJAX, jQuery – Fórum – Programujte.comHTML 5 require validácia JavaScript – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 
Hledat
Vybavení pro Laser Game
Spuštěn Filmový magazín
Laser Game Brno
Pergoly a střechy Brno

Ján
~ Anonymní uživatel
179 příspěvků
21. 12. 2017   #1
-
0
-

Ahojte,

rád b som ešte pred odoslaním formu cez JS aspoň základne validoval cez HTML5 cez atribúty ako require alebo aj typ inputov ako email a pod. A až potom zavolal JS, príde mi to lepšie takto jednoducho validovať a neskôr na strane PHP ešte ošetriť. Ako to spraviť? Mám toto JS na odosielanie:

<script>
function SubmitFormData() {
$('#businessname').attr('required', 'required');
    var name = $("#name").val();
    var email = $("#email").val();
    var phone = $("#phone").val();
    var gender = $("input[type=radio]:checked").val();
    $.post("submit.php", { name: name, email: email, phone: phone, gender: gender },
    function(data) {
	 $('#results').html(data);
	 $('#myForm')[0].reset();
    });
}


</script>
</head>
<body>
  <form id="myForm" method="post">
     Name:    <input name="name" id="name"  type="text" /><br />
     Email:   <input name="email" id="email" type="text" /><br />
     Phone No:<input name="phone" id="phone" type="text" /><br />
     Gender:  <input name="gender" type="radio" value="male">Male
	      <input name="gender" type="radio" value="female">Female<br />

    <input type="button" id="submitFormData" onclick="SubmitFormData();" value="Submit" />
   </form>

Skúšal som dané atribúty, ale JS a odosielanie ich ignoruje, ako to mám upraviť aby to bralo v úvahu?

Ďakujem pekne :)

Nahlásit jako SPAM
IP: 95.105.210.–
peter
~ Anonymní uživatel
3714 příspěvků
21. 12. 2017   #2
-
0
-

$.post to odesila. Takze, pokud chces delat nejake upravy, tak predtim. Treba pridat if (zkontroluj(data)) {odesli(data);} else{vypis_error(data);})

Navic, tahal bych to do pole a ne do jednotlivych promennych. S tim se pak o neco lepe pracuje.

XXX
var name = $("#name").val();
var email = $("#email").val();
var phone = $("#phone").val();
var gender = $("input[type=radio]:checked").val();
$.post("submit.php", { name: name, email: email, phone: phone, gender: gender },...
XXX

var data = {
  name: $("#name").val(),
  email : $("#email").val(),
  phone : $("#phone").val(),
  gender : $("input[type=radio]:checked").val()
  };
if (zkontroluj(data))
  {$.post("submit.php", data, odpoved };}
else
  {chyba(data);}
function zkontroluj(data) {...}
function chyba(data) {...}
function odpoved (dataodpovedi) {
  $('#results').html(dataodpovedi);
  $('#myForm')[0].reset();
});
Nahlásit jako SPAM
IP: 2001:718:2601:258:a1e9:60...–
peter
~ Anonymní uživatel
3714 příspěvků
21. 12. 2017   #3
-
0
-

Jo, ono to mozna neni jasne, ale function zkontroluj(data) by melo vratit return true pro dataok a return false pro chybu.
 

Nahlásit jako SPAM
IP: 2001:718:2601:258:a1e9:60...–
Ján
~ Anonymní uživatel
179 příspěvků
21. 12. 2017   #4
-
0
-

#3 peter
Ďakujem ale asi som to zle napísal, alebo pochopil.

Ide mi o to, že HTML5 už má vnorené atribúty a možnosti, ktoré kontrolujú ešte pred POST.

Napr.

<input type="text" name="polozka" required>

<input type="email">

<input type="number"> ...

Pri normal POST to nepustí, pokým to nemá požadovanú hodnotu, pri tomto JS to zbehne či to tam je definované, alebo nie. Hľadám a teda niečo, čo bude brať tieto HTML5 atribúty v úvahu.

Ďakujem.

Nahlásit jako SPAM
IP: 95.105.210.–
peter
~ Anonymní uživatel
3714 příspěvků
22. 12. 2017   #5
-
0
-

Kdyz neco nevim, zeptam se nejdriv googlu :)
google = javascript input email
Treba takova nahodna stranka, neco tam bude...
https://developer.mozilla.org/…/input/email

Nicmene, kdyby ti nevadilo, ze to neodchazi pres $.post, ale odesila se formular, tak formular ma udalost <form onsubmit="mojeFunkce();">. Kdyz mojeFunkce vrati true (return true), formular se odesle, jinak nee. Funkce, bez return vraci vzdy true. Cili, misto type=button to zmenis na submit a tu funkci presunes z tlacitka pod form. Nedavej tam ale id=submit ani name=submit.
A pak je moznost, misto $.post tam napsat form.submit(). Opet, nedavej zadnemu tlacitku ani inputu id=submit ani name=submit, protoze pak javascript pri form.submit bude chtit pracovat s inputem, misto aby formular odesilal. 

document.getElementById('myForm').submit()
document.forms[0].submit()
document.forms['mujform'].submit() // <form name=mujform>
$('#myForm').submit() // tady si ale nejsem jisty zapisem, jquery to mozna ma jinak nez javascript
Nahlásit jako SPAM
IP: 2001:718:2601:258:8c0b:61...–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 2 hosté

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032021 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý