Започнахме урока, за да получим създаване и изпращане на формуляри чрез Ajax, за това, когато създаваме страници в HTML е много лесно правете формуляри въвеждане на данни, или да ни служи като форма за контакти със самата страница или организация, за да извършите проучване, като регистрация и т.н. Нормалното е, че ако искаме да направим тази форма за нещо просто, използваме метода PHP Post, за да изпратим информацията и да можем да я прегледаме, обработим или променим.
Използването на този метод в PHP обаче има голям недостатък, че при въвеждане на данни имаме нужда от актуализиране или презареждане на въпросната страница. Ето защо ще видим метод, при който няма нужда от него.
Имам предвид формуляр, създаден с Ajax, също помогнат с PHP и създаден за страница в HTML. Очевидно трябва да създадем нашата страница в HTML, нашия индекс, който можем да персонализираме или персонализираме със стилове благодарение на CSS файл.
След създаването на тази база ще трябва да създадем още 2 файла, php файл, където ще редактираме въведените данни от формата и скрипт, реализиран в javascript, тоест .js файл. В този скрипт ще използваме Ajax за обработка на данните по такъв начин, че не е нужно да презареждаме нашата уеб страница, както би се случило, ако използваме само php метод като Post или get.
освен това ще трябва да включим jQuery библиотека да можем да интерпретираме това, което пишем с Ajax.
За начало е важно да запомните, че всички файлове, които създаваме, нашия Ajax javascript файл, който ще наричаме operation.js, css файла със стилове, който ще наричаме styles.css, ако ще създаваме такъв, и библиотека на jQuery трябва да я включим в началото на нашия HTML код.
Толкова е просто, колкото включете ги в главата от нашия index.html:
…Сега ще създадем файл с прост php код, който ще наречем envio.php, където ще събираме информацията, която се изпраща чрез нашата уеб страница. В този случай информацията ще бъде за формуляр за контакт, така че данните ще бъдат изпратени на нашия собствен имейл адрес, за да можем да четем съобщенията, оставени от потребителите, въпреки че това може да бъде променено и изпратено на друга страница или друго място.
След като създадем php кода, нека да преминем към наистина интересното нещо, което е създаването на нашия файл operation.js, където ще използваме Ajax. По този начин ние ще обработваме данните за нашата форма за контакт, без да актуализираме страницата, както е посочено по -горе. Първо ще покажем кода, който трябва да напишем в нашия скрипт:
функция sendMail () {$ ("# car_send"). attr ("забранено", вярно); $ (". car_error"). remove (); var филтър = / [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 („Въведете валиден имейл.“); sendMail = "false"; } if (s_name.length == 0) {$ (‘# c_name’). after („Моля, въведете вашето име.“); var sendMail = "false"; } if (s_msj.length == 0) {$ (‘# c_msg’). after („Въведете съобщение.“); var sendMail = "false"; } if (sendMail == "true") {var data = {"name": $ ('# c_name'). val (), "email": $ ('# c_mail'). val (), "message" : $ ('# c_msg'). val ()}; $ .ajax ({data: data, url: 'send.php', type: 'post', beforeSend: function () {$ ("# car_send"). val ("Изпращане …");}, успех : 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 ("забранено"); }} Създаваме променлива на филтъра, за да проверим дали имейлът, който вмъкваме, е валиден, за това поставяме, че въведеният адрес е някаква последователност от знаци, последвана от символ at, друга последователност от знаци, точка и повече знаци. Ако той няма тази структура, когато изпращаме съобщението, той ще ни каже, че не може да бъде изпратен, тъй като въведеният имейл не е валиден. Ако отговаря на изискванията, съхранявайте стойността true в променливата sendmail за изпращане на имейл и продължете да проверявате.
След това потвърдете дължината на името. Ако е равно на 0, това означава, че не сме въвели име и той иска да го въведем отново.
Той прави същото със съобщението и неговата дължина, за да провери дали не сме оставили полето празно.
След като проверите всички полета и видите, че са правилни, запишете в променливата данни, която е масив, името, имейла и съобщението, което трябва да бъде изпратено.
И накрая, с Ajax предаваме данните и правим препратка към файла envio.php чрез метода post и изпращаме информацията. Преди да бъде изпратено, съобщението се появява "изпращане" докато процесът приключи успешно.
Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка
