De câte ori ați întâlnit faptul că ați introdus date incorecte, din cauza cărora pagina s-a reîncărcat și a șters complet caracterele introduse în câmpuri. Pentru a remedia acest lucru, există o abordare destul de populară pentru construirea unei interfețe cu utilizatorul, iar numele acesteia este ajax. Apare în multe proiecte și este folosit în multe feluri.
Trimiterea unui formular ajax: conectarea bibliotecilor
Include biblioteca jquery în index.php.
Există o altă modalitate de a include jquery într-un document. Trebuie să descărcați biblioteca de pe site-ul oficial jquery, să o plasați în folderul potrivit și să lipiți linkul către ea astfel:
Conectarea și configurarea documentelor
1. Creați un document.php în folderul cu site-ul cu orice nume convenabil pentru dvs. - aceasta va fi trimiterea formularului php ajax. În el puteți scrie în ce format va fi afișat textul cu mesajul. De exemplu, form1.php.
2. În folderul cu fișiere javascript, creați un fișier.js cuorice nume convenabil. De exemplu, form.js.
3. Conectați acest dosar la documentul dvs.
4. Creați un formular cu următorii parametri:
În el, nu uitați să creați câmpuri pentru introducerea datelor dvs.
5. Accesați fișierul form1.php din directorul cu site-ul, în care scrieți:
Acum, la trimiterea formularului, browserul va afișa informații despre date.
În același fișier, puteți scrie ce anume va fi afișat sau cum. De asemenea, puteți scrie cicluri sau algoritmi aici.
Trimiterea formularului jquery ajax
1. În fișierul form.js creat, trebuie să scrieți codul care este responsabil pentru ca fișierul să funcționeze după ce pagina site-ului este complet încărcată.
$(document).ready(function(){ //Următorul nostru cod va rula aici });
2. Apoi, trebuie să personalizați butonul de trimitere. Faceți totul în același fișier.
$("form").submit(function(event) { event.preventDefault(); //următorul cod va fi scris aici });
Prima parte a codului este responsabilă pentru selectarea elementului de pe pagină, iar a doua este responsabilă pentru prevenirea acțiunii implicite.
3. Apoi, de exemplu, luați o trimitere a unui formular ajax la succes.
$.ajax({ tip: $(this).attr('metodă'), url: $(this).attr('action'), date: new FormData(this), contentType: fals, cache: false, processData: false, succes: function(result){ alert(result); } });
Următoarele sunt descrieri detaliate ale fiecărei setări.
- tip -acesta este tipul de cerere care se depune în formular; deoarece costă POST, tipul de solicitare va fi adecvat;
- this - selecția elementului în interiorul construcției;
- attr - prescurtare pentru atracție (atracție), adică un anumit parametru al țintei (formei) selectate este atras;
- url - parametru responsabil de unde va fi trimisă cererea; în acest caz, ceea ce este scris în parametrii formularului (form1.php);
- date - specifică datele formularului;
- contentType - responsabil pentru trimiterea antetelor către server; în acest caz nu este necesar;
- cache - responsabil pentru salvarea memoriei cache a utilizatorului;
- processData - responsabil pentru conversia datelor într-un șir;
- success - afișează rezultatul unei trimiteri de date cu succes; prin urmare, dacă trimiterea datelor a avut succes, atunci acțiunile funcției sunt executate.
4. Gata, acum, când trimiteți formularul ajax, veți primi date fără a reîmprospăta pagina.
Rezultatul poate fi modificat folosind fișierul form1.php, unde puteți specifica ce anume va fi afișat ca rezultat. De exemplu, Puteți experimenta și crea o verificare pentru corectitudinea introducerii anumitor date: dacă datele nu sunt corecte, atunci se afișează mesajul dorit, în caz contrar se redirecționează către pagina corectă. Multe alte lucruri sunt, de asemenea, posibile, orice îți dorește inima.
Există și trimiterea de date către server în mod asincron. Acesta este momentul în care utilizatorul introduce text și acesta este imediat evidențiat cu roșu, indicând faptul că datele introduse nu sunt corecte. Despreexistă multe manuale pe Internet, unde totul este explicat clar și prezentat cu exemple.
Concluzie
Fără îndoială, ajax este un instrument util în construirea site-ului web. Pentru a face pagini și interfețe de în altă calitate, este pur și simplu necesar. Este de remarcat faptul că este foarte important să cunoașteți jQuery pentru a înțelege pe deplin imaginea și ceea ce este scris în cod, deoarece un simplu copy-paste nu poate întotdeauna să vă ajute și să vă învețe să înțelegeți codul. Merită întotdeauna să ne amintim că versiunile lingvistice sunt actualizate și că unele funcții pot dispărea pur și simplu. Prin urmare, nu toate soluțiile pot fi relevante, de multe ori codul scris pur și simplu nu funcționează sau nu produce rezultatul pe care ați dori să-l vedeți pe ecran.
