Mēs sākām apmācību, lai iegūtu veidlapu izveidošana un iesniegšana, izmantojot Ajax, tāpēc, veidojot lapas HTML, tas ir ļoti vienkārši veidot veidlapas datu ievadi, vai nu lai kalpotu mums kā Saziņas veidlapa ar pašu lapu vai organizāciju, lai veiktu aptauju, piemēram, reģistrāciju utt. Parastā lieta ir tāda, ka, ja mēs vēlamies izveidot šo veidlapu kaut kam vienkāršam, mēs izmantojam PHP Post metodi, lai nosūtītu informāciju un varētu to apskatīt, apstrādāt vai modificēt.
Tomēr šīs metodes izmantošanai PHP ir liels trūkums, ka, ievadot datus, mums ir jāatjaunina vai jāielādē attiecīgā lapa. Tāpēc mēs redzēsim metodi, kurā tā nav vajadzīga.
Es domāju veidlapu, kas izveidota, izmantojot Ajax, palīdzēja arī PHP un tika izveidota lapai HTML. Acīmredzot mums ir jāizveido sava lapa HTML, mūsu rādītājā, ko mēs varam pielāgot vai personalizēt ar stiliem, pateicoties CSS failam.
Pēc šīs bāzes izveidošanas mums būs jāizveido vēl 2 faili, php fails, kurā mēs rediģēsim ievadīto datu veidlapu, un skripts, kas ieviests javascript, tas ir, .js failā. Šajā skriptā mēs izmantosim Ajax, lai apstrādātu datus tādā veidā, ka mums nav jāpārlādē mūsu tīmekļa lapa, kā tas notiktu, ja mēs izmantotu tikai tādu PHP metodi kā Post vai get.
Bez šī mums būs jāiekļauj jQuery bibliotēka lai spētu interpretēt mūsu rakstīto ar Ajax.
Vispirms ir svarīgi atcerēties, ka visi mūsu izveidotie faili, mūsu Ajax javascript fails, ko mēs sauksim par operāciju.js, css stila lapas fails, ko mēs sauksim par stiliem.css, ja mēs to izveidosim, un jQuery bibliotēka, tā jāiekļauj mūsu HTML koda sākumā.
Tas ir tik vienkārši kā iekļaut tos galvā no mūsu index.html:
…Tagad mēs izveidosim failu ar vienkāršu php kodu, ko mēs sauksim par envio.php, un mēs apkoposim informāciju, kas tiek nosūtīta caur mūsu tīmekļa lapu. Šajā gadījumā informācija būs paredzēta saziņas veidlapai, tāpēc dati tiks nosūtīti uz mūsu e -pasta adresi, lai varētu izlasīt lietotāju atstātos ziņojumus, lai gan to var mainīt un nosūtīt uz citu lapu vai citu vietu.
Pēc php koda izveides ķersimies pie patiešām interesantās lietas, kas ir mūsu operation.js faila izveide, kur izmantosim Ajax. Tādā veidā mēs apstrādāsim mūsu kontaktformas datus, neatjauninot lapu, kā norādīts iepriekš. Vispirms mēs parādīsim kodu, kas mums jāraksta mūsu skriptā:
function sendMail () {$ ("# car_send"). attr ("atspējots", true); $ (". auto_kļūda"). remove (); var filtrs = / [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 (); ja (filter.test (s_email)) {sendMail = "true"; } cits {$ (‘# c_mail’). after ("Ievadiet derīgu e -pasta adresi."); sendMail = "nepatiess"; } if (s_name.length == 0) {$ (‘# c_name’). pēc ("Lūdzu, ievadiet savu vārdu."); var sendMail = "nepatiess"; } if (s_msj.length == 0) {$ (‘# c_msg’). after ("Enter message."); var sendMail = "nepatiess"; } ja (sendMail == "true") {var data = {"name": $ ('# c_name'). val (), "email": $ ('# c_mail'). val (), "message" : $ ('# c_msg'). val ()}; $ .ajax ({dati: dati, url: 'send.php', tips: 'post', beforeSend: function () {$ ("# car_send"). val ("Sūta …");}, panākumi : funkcija (atbilde) {$ ('forma') [0] .reset (); $ ("# car_enviar"). val ("Iesniegt"); $ ("# c_information p"). html (atbilde); $ ("#c_information"). fadeIn ('lēns'); $ (" # car_enviar"). removeAttr ("atspējots");}}); } cits {$ ("# car_submit"). removeAttr ("atspējots"); }}Mēs izveidojam filtra mainīgo, lai pārbaudītu, vai mūsu ievietotais e -pasts ir derīgs, tāpēc mēs norādām, ka ievadītā adrese ir kāda rakstzīmju secība, kam seko simbols pie, cita rakstzīmju secība, punkts un citas rakstzīmes. Ja, nosūtot ziņojumu, tai nav šādas struktūras, tā mums pateiks, ka to nevar nosūtīt, jo ievadītais e -pasts nav derīgs. Ja tas atbilst prasībām, saglabājiet vērtību true e -pasta mainīgajā sendMail un turpiniet pārbaudīt.
Pēc tam apstipriniet vārda garumu. Ja tas ir vienāds ar 0, tas nozīmē, ka mēs neesam ievadījuši vārdu un tas lūdz mums to ievadīt vēlreiz.
To pašu dara ar ziņojumu un tā garumu, lai pārbaudītu, vai neesam atstājuši lauku tukšu.
Pēc visu lauku pārbaudes un redzot, ka tie ir pareizi, saglabājiet datu mainīgajā, kas ir masīvs, vārdu, e -pastu un nosūtāmo ziņojumu.
Visbeidzot, izmantojot Ajax, mēs nododam datus un darām atsauce uz failu envio.php, izmantojot pasta metodi un mēs nosūtām informāciju. Pirms nosūtīšanas tiek parādīts ziņojums "sūtīšana" līdz process veiksmīgi beidzas.
Vai jums patika šī apmācība un palīdzējāt tai?Jūs varat apbalvot autoru, nospiežot šo pogu, lai sniegtu viņam pozitīvu punktu