Započeli smo vodič kako bismo dobili izrada i podnošenje obrazaca putem Ajaxa, jer kada stvaramo stranice u HTML -u to je vrlo jednostavno napraviti obrasce unos podataka, bilo da nam služi Kontakt obrazac sa samom stranicom ili organizacijom za provođenje ankete, poput registracije itd. Normalno je da ako želimo napraviti ovaj obrazac za nešto jednostavno, koristimo PHP Post metodu za slanje informacija i mogućnost pregleda, obrade ili izmjene.
Međutim, uporaba ove metode u PHP -u ima veliki nedostatak, što prilikom unosa podataka imamo potrebu ažurirati ili ponovno učitati dotičnu stranicu. Zato ćemo vidjeti metodu u kojoj za njom nema potrebe.
Mislim na obrazac kreiran s Ajaxom, također pomogao u PHP -u i kreiran za stranicu u HTML -u. Očito moramo stvoriti našu stranicu u HTML -u, naš indeks, koji možemo prilagoditi ili prilagoditi stilovima zahvaljujući CSS datoteci.
Nakon stvaranja te baze trebat ćemo stvoriti još 2 datoteke, php datoteku u kojoj ćemo urediti unos podataka pomoću obrasca i skriptu implementiranu u javascript, to jest .js datoteku. U ovoj skripti koristit ćemo Ajax za obradu podataka na takav način da ne moramo ponovno učitavati našu web stranicu kao što bi se dogodilo da smo koristili samo php metodu poput Post ili get.
Osim ovoga morat ćemo uključiti jQuery knjižnicu kako bismo mogli tumačiti ono što pišemo s Ajaxom.
Za početak, važno je zapamtiti da sve datoteke koje stvaramo, našu Ajax javascript datoteku koju ćemo nazvati operation.js, datoteku stilske tablice css koju ćemo nazvati styles.css, ako ćemo je stvoriti, i biblioteku jQuery moramo je uključiti na početak našeg HTML koda.
Jednostavno je kao uključi ih u glavu iz našeg index.html:
…Sada ćemo stvoriti datoteku s jednostavnim php kodom koju ćemo nazvati envio.php gdje ćemo prikupljati podatke koji se šalju putem naše web stranice. U tom će slučaju podaci biti za obrazac za kontakt pa će se podaci slati na našu vlastitu adresu e -pošte kako bismo mogli čitati poruke koje su ostavili korisnici, iako se to može izmijeniti i poslati na drugu stranicu ili drugo mjesto.
Nakon stvaranja php koda, idemo na zaista zanimljivu stvar, a to je stvaranje naše datoteke operation.js u kojoj ćemo koristiti Ajax. Na ovaj način ćemo obraditi podatke za naš obrazac za kontakt bez ažuriranja stranice kako je prethodno navedeno. Prvo ćemo pokazati kôd koji moramo napisati u svoju skriptu:
funkcija sendMail () {$ ("# car_send"). attr ("onemogućeno", istina); $ (". auto_pogreška"). remove (); var filter = / [A-Za-z] [A-Za-z0-9 _] * @ [A-Za-z0-9 _] +. [A-Za-z0-9 _.] + [A -za- z] $ /; var s_email = $ ('# c_mail'). val (); var s_name = $ ('# c_name'). val (); var s_msj = $ ('# c_msg'). val (); if (filter.test (s_email)) {sendMail = "true"; } else {$ (‘# c_mail’). after ("Unesite valjanu e -poštu."); sendMail = "false"; } if (s_name.length == 0) {$ (‘# c_name’). after ("Molimo unesite svoje ime."); var sendMail = "false"; } if (s_msj.length == 0) {$ (‘# c_msg’). after ("Unesite poruku."); var sendMail = "false"; } if (sendMail == "true") {var data = {"name": $ ('# c_name'). val (), "email": $ ('# c_mail'). val (), "message" : $ ('# c_msg'). val ()}; $ .ajax ({data: data, url: 'senting.php', type: 'post', beforeSend: function () {$ ("# car_send"). val ("Sending …");}, uspjeh : function (response) {$ ('form') [0] .reset (); $ ("# car_enviar"). val ("Submit"); $ ("# c_information p"). html (response); $ ("#c_information"). fadeIn ('slow'); $ (" # car_enviar"). removeAttr ("disabled");}}); } else {$ ("# car_submit"). removeAttr ("disabled"); }} Kreiramo varijablu filtra kako bismo provjerili je li poruka e -pošte koju smo umetnuli valjana. Za to stavljamo da je unesena adresa neki niz znakova iza kojeg slijedi simbol at, drugi niz znakova, točka i više znakova. Ako nema takvu strukturu kada šaljemo poruku, reći će nam da se ne može poslati jer je unesena e -pošta nevažeća. Ako ispunjava uvjete, pohranite vrijednost true u varijablu za slanje e -pošte sendMail i nastavite provjeru.
Zatim potvrdite duljinu imena. Ako je jednako 0, znači da nismo unijeli ime i traži da ga ponovno unesemo.
Isto radi s porukom i njezinom duljinom kako bi provjerio nismo li polje ostavili prazno.
Nakon što ste provjerili sva polja i vidjeli da su točna, spremite u podatkovnu varijablu koja je niz, naziv, e -poštu i poruku za slanje.
Konačno, s Ajaxom prosljeđujemo podatke i radimo upućivanje na datoteku envio.php metodom objave i šaljemo podatke. Prije nego što se pošalje, pojaviće se poruka "slanje" dok se proces uspješno ne završi.
Je li vam se svidio i pomogao ovaj vodič?Autor možete nagraditi pritiskom na ovaj gumb kako biste mu dali pozitivan bod
