Css — Форма обратной связи с несколькими вложениями. PHP


Содержание

PHP форма обратной связи

Вы когда-нибудь хотели установить на свой сайт форму обратной связи? Наверняка Вы встречались с подобными скриптами. Как ни странно, готовые скрипты отправки формы на email пользуются большой популярностью (Вы можете убедиться в этом в любом архиве скриптов), причем их существует великое множество. Есть простые, в которых ничего не меняется, а есть сложные и большие системы, которые функционируют на mysql, позволяют динамически изменять любые поля, содержат кучу настроек… Но так ли они нужны? На мой взгляд необходимость в подобных системах очень сомнительна.

Тестировать отправку почты на домашнем компьютере не получиться. Для этого Вам необходим хостинг с поддержкой php и функциями отправки почты. Я рекомендую Вам хостинг-провайдера runweb.ru. Этот провайдер предлагает отличные тарифы, высочайшую скорость доступа и отличное обслуживание.

Методы отправки почты

Отправлять почту с сервера с помощью php можно двумя основными способами.
Я хочу рассмотреть оба этих способа по порядку.

Первый и самый простой — это использование php функции mail(). Функция очень простая и понятная, хотя отправка почты с использованием mail() имеет и ряд недостатков. Самый главный — письмо отправляется не напрямую, а через php. Одновременно программа php подставляет в письмо некоторые свои поля. Например, у Вас не получится корректно указать отправителя. В поле «from» (то есть от кого пришло письмо) в большинстве случаев будет стоять имя сервера. Все дело в том, что php подставляет свои заголовки в служебную строку письмо «from».

Тем не менее отправка почты с помощью функции mail() остается самым простым
способом отправить письмо с сервера. Давайте рассмотрим этот способ подробнее.

Функция mail() имеет следующий синтаксис:

Вот полный пример отправки почты с помощью mail():

Обратите внимание, что при использовании этой функции на домашнем компьютере она может выдавать ошибку, так как не может отправить письмо без почтового сервера.

Теперь давайте посмотрим, как можно отправить письмо с помощью sendmail.

sendmail — это стандартная программа операционной системы unix, которая отправляет почту.
php может запускать unix-программы путем использования средства pipes (дословно «трубопроводы»). Это средство unix позволяет направлять данные из одной программы в другую, наподобие того, как мы пишем в файл. Только файлом в этом случае выступает программа (в частности, sendmail), которая и получает данные.

sendmail программа имеет множество параметров, мы будем использовать некоторые из них. Чтобы использовать sendmail, нужно открыть к нему поток (pipe). В php это делается использованием команды popen(), которая по синтаксису идентична команде fopen(). Путем использования popen() мы открывает поток к sendmail
для записи в него (помните, параметр режима «w»?), после чего можно отправлять в него данные обычной командой fputs(). Посмотрим, как полностью выглядит процедура отправки письма через sendmail:

В этой программе первое, что мы делаем — описываем rfc заголовки. rfc — это службные поля, которые содержат всю информацию о письме. Увидеть пример rfc Вы можете, например, в программе the bat!, щелкнув правой кнопкой мыши на тексте письмо и выбрав «rfc-822 headers» (название пункта может отличаться). Чтобы убрать их, повторите действия. В заголовке мы описываем поля «content-type», которые указывают что письмо текстовое и в кодировке windows-1251 (стандартная кодировка windows). В качестве кодировки также может быть использовано «koi8-r», это стандартная кодировка unix. В этой статье мы не будем рассматривать возможные rfc заголовки подробно. Мы сделаем это чуть позже,
когда будем ближе работать с почтой. Итак, после того, как мы описали служебные переменные и заголовки письма, мы открываем sendmail. Обратите внимание на путь к программе «/usr/sbin/sendmail». На разных серверах он может отличаться!
Если эта строка не работает, спросите у Вашего провайдера, где расположен sendmail. Далее указываются параметры: «-i -f$from — $recipients». Это стандартные параметры для отправки письма и в них подставляется два поля: $from — от кого, $recipients — адреса получателей. В нашем случае переменная $recipients содержит всего один адрес. На самом деле можно использовать несколько адресов, указывая их через пробел:

Далее мы записываем в поток сначала заголовки письма (переменная $text_headers), потом отделяем их символом переноса строки и записываем текст сообщения. Последний шаг — закрытие потока и проверка на ошибку. При правильном выполеннии в переменную $result помещается ноль, а если возникла ошибка, в нее записывается номер ошибки.

Теперь давайте рассмотрим пример использования возможностей отправки почты. Для этого мы сделаем форму обратной связи, которую Вы сможете установить на свой сайт. В качестве метода отправки письма мы будем использовать sendmail.

Создаем форму обратной связи

Наша форма обратной связи будет представлять собой один скрипт. Этот скрипт будет выводить форму и отправлять письмо.

Теперь давате рассмотрим, как работает эта программа. Выполнение начинается со строки «if (!$a) show_form();», так как до этого указана функция, которая, естественно, не выполняется. В этой строке мы проверяем, была ли попытка заполнения формы (из формы, как Вы видите, передается переменная $a, которая и проверяется в этой строке). Если такой попытки не было, вызывается функция show_form(), которая выводит форму.

Далее, если форма уже передавалась скрипту, проверяются обязательные поля. Поля «имя», «email» и «текст сообщения» являются обязательными. Если какое-либо из них не заполнено, форма вызывается с параметром $s, в котором передается сообщение об ошибке.

Теперь, если все правильно, мы описываем необходимые переменные и rfc заголовки письма, после чего отправляем сообщение через sendmail и выводим сообщение о результате (отправлено/не отправлено). Здесь все просто и понятно из предыдущих примеров.

Собственно это и все, что необходимо, чтобы сделать форму обратной связи на Вашем сайте ��
Как видите, ничего сложного нет и программа получается довольно маленькая.

Форма обратной связи html + css + php + jQuery + js

by Andrej — Category Веб-дизайнеру on 27/11/2020

Привет всем!
Хочу поделиться с вами готовой формой обратной связи для сайта, работающей на PHP, jQuery и имеющую некоторые бонусы, такие как встроенная защита от спама и запрет нажатия кнопки. Никаких особых умений вам не потребуется, достаточно будет знания основ html верстки и элементарной логики.

Так в конечном итоге будет выглядеть форма обратной связи

Давайте сразу рассмотрим все поля, которые будут вам доступны в этой форме.

Структура полей формы обратной связи

  • имя отправителя
  • почтовый адрес
  • телефон
  • компания отправителя
  • сайт отправителя
  • продукт (направление)
  • список необходимых услуг
  • дополнительная информация
  • антиспам / защита от роботов

Особенности и возможности

  • блокировка кнопки «отправить» до выполнения необходиых условий
  • простой селектор для проверки и защиты от роботов
  • дополнительная кнопка «очистить все поля»

Что входит в форму обратной связи?

  • HTML разметка (создание макета)
  • Стилизация полей формы на CSS/SCSS
  • jQuery + js
  • PHP обработчик

Создание HTML разметки

И так, давайте посмотрим на разметку формы:

  1. Здесь есть три первых поля, у которых указан id и некое js-событие onkeyup=»checkParams()» (они понадобятся нам позднее). Для них будет проводиться обязательная проверка правильности ввода данных. За это отвечает атрибут required . Если вам необходимо убрать или сделать обязательным другое поле, просто удалите/добавьте этот атрибут.
  2. Несколько дополнительных полей, не являющихся обязательными.
  3. Селектор выбора предоставляемых услуг select .
  4. Поле дополнительной информации textarea .
  5. Селектор для проверки на «человечность» — Я работ | Я человек.
  6. Две кнопки: Отправить и Стереть информацию в заполненных полях.
  7. По-хорошему, здесь еще не хватает поля с галочкой, для подтверждения согласия на обработку данных, но ее добавлению, надеюсь, не вызовет у вас трудностей.

Вроде все. Едем дальше.

Оформление формы CSS/SCSS

Все поля формы стилизованы при помощи CSS flexbox (Flexible Box Layout Module) и разбиты на группы дополнительными классами. Разумеется, вы можете создать свои собственные стили. Если вы владеете CSS, то задать оформление для всех элементов формы сможете без проблем, тут даже не потребуется моя помощь.

Настройка PHP кода

Теперь переходим к обработчику формы, где все действия начинаются с зависимости от выбранного селектора — Бот/Человек.

Что здесь есть?

  • header(‘Refresh: 5; URL=https://www.site.ru’); — после заполнения формы ботом, отправляет на страничку с уведомлением и через 5 секунд возвращает на указанную в поле.
  • mail, name, phone, . — настройка соответствия html полей. Здесь вам необходимо указать все соответствующие имена name=»» в форме обратной связи. Таким образом, в поле services вам необходимо указать точно такой же порядок опций, что и в html разметке.
  • $mess — это тело сообщения, которое будет приходить в письме. Вы можете поменять их местами, изменить названия или просто удалить/закомментировать не нужные.
  • $headers — обязательная строка, указывающая кодировку письма. Если вы случайно сотрете или измените charset=utf-8 , то все ваши слова превратятся в иероглифы.
  • header — после успешного нажатия на кнопку, посетитель будет отправлен на страничку уведомления и через 5 секунд произойдет перенаправление на указанную страничку. Или же else < он получит увдомление об ошибке.

Здесь все. Едем дальше.

Дополнительные плюшки на js и jQuery

Ранее мы рассмотрели html шаблон формы, в котором видели добавленные id и функции у трех обязательных полей. Пришло время разобраться, для чего они были добавлены.

Посмотрите на js-код. Это блокиратор кнопки, который при disabled не дает посетителю нажать ее, прежде чем необходимые вам поля будут заполнены.

Мы вставляем id в необходимые поля и disabled в кнопку для того, чтобы привязать их к данному скрипту. Вы можете изменить их названия и количество, добавив/убрав нужные var-строки. Но, если вы добавите или уберете их, не забудьте изменить условия в строке if (name.length != 0 && email.length >= 6 && phone.length >= 10) < .

Как работает эта строка?

Все завязано на количестве символов в указанном поле, т.е. ее длине length .

  • if (name.length != 0 — указывает на то, что поле не должно быть пустым. Читается как — «если в поле число символов не равно нулю, то…»
  • && — объединяет условия (и)
  • email.length >= 6 — кол-во символов должно быть больше или равно 6. Почему шесть? Я указал это число потому, что минимальный почтовый адрес состоит из 6 символов. Проверим? @bk.ru — 6 символов.
  • phone.length >= 10 — больше или равно десяти символам. Почему 10, а не 11 ? При заполнении этого поля, посетитель может указать свой телефон как с +7, так и через 8. Поэтому лучше указывать 10.

На этом все. Подключайте форму, тестируйте и пользуйтесь.

Если у вас остались вопросы, пишите в комментариях и не поскупитесь на оценку статьи. Заранее спасибо ��

Действующие акции

Несколько форм на одной странице с отправкой без перезагрузки

Вы можете скачать готовые файлы, в которые дополнительно включена проверка введенных данных в форму (валидация), поделившись статьей в Twitter.

Представьте, что у вас на странице сайта есть несколько форм связи с различным предназначением. Лучший способ объяснить эту потребность, это создание сайта, в котором необходимо разместить форму заказа звонка, форму запроса цены, форму запроса каталога и еще какие-либо необходимые вам формы.

За пересылку письма с введенными в форму данными отвечает PHP обработчик. Для передачи данных в обработчик используется кнопка с типом submit . В случае использования нескольких форм связи с одним php обработчиком Вы должны передать в него данные именно той формы, в которой была нажата кнопка «Отправить». Это можно сделать через if/else , с учетом разных имен атрибутов, наплодив одинаковых кусков кода, можно создать кучу обработчиков с разными именами, но одинаковым кодом, а можно использовать скрипт jQuery с помощью которого данные в обработчик будут отправляться из той формы где было произведено нажатие на кнопку «Отправить».

Далее мы покажем, как реализовать на одной странице несколько форм связи, отправляющих данные без перезагрузки страницы в один обработчик.

Несколько форм связи с одним обработчиком

К примеру, возьмем три формы.

Присвойте каждой форме свой уникальный id . У нас это form1, form2 и form3. Кроме того, для стилизации формы примените классы css , для отображения подсказки включите атрибуты placeholder , а для формирования темы письма добавьте скрытый input .

Таким образом, теперь формы имеют различные идентификаторы id и мы можем написать скрипт, который будет отправлять данные в обработчик ориентируясь на id формы.

Отправка формы без перезагрузки страницы

Обычно при отправке данных из формы происходит перенаправление на страницу подтверждения. В случае использования нескольких форм на странице, это будет мешать и отвлекать клиента от вашего предложения и заполнения какого-либо другого запроса.

Используя AJAX, отправку формы без перезагрузки страницы сделать очень легко.

Форма связи в процессе заполнения

После нажатия кнопки «Отправить» вместо полей ввода формы у вас появится сообщение об отправке.

Форма связи после нажатия кнопки «Отправить»

update: При необходимости восстановления формы после отправки данных, вы можете использовать следующее решение (вставьте выделенный код в указанное место и оберните все input в форме в div с id, например inputs):

Метод .load() загружает данные и вставляет в указанный элемент.

«#parent» — id формы, в которую необходимо вставить удаленные данные.
В приведенном примере скрипта с отправкой данных форм без перезагрузки страницы, оберните в div все input . Назначьте ему id , например inputs . Этот div с вложенными полями input удаляется скриптом, на его месте появляется сообщение об отправке. Получается, что в коде остается тег form с id , этот id необходимо указать в #parent , это станет контейнером для загрузки скриптом данных формы (удаленные input ).

«http://site.ru» — адрес вашей страницы с формой, откуда скрипт загрузит удаленные input . Например, если ваша форма будет находиться по адресу http://site.ru/contacts.html, вставляете этот адрес.

«#child» — id блока, который содержит input . В данном случае div #inputs .


3000 — время в мс через которое восстановится код формы.

PHP обработчик

Большинство форм для передачи данных используют метод POST , это позволяет «спрятать» данные формы и не загромождать URL в адресной строке.

Данный обработчик содержит проверку метода передачи данных.

Создавая формы на страницах своего сайта, не забывайте о внедрении проверки введенных данных и методах защиты от спама.

Возникли вопросы? Давайте обсудим их в комментариях.

Создание сайта компании
Madcatzz

Чтобы быть успешным сегодня, вы должны продавать свои услуги или продукцию как можно более широкому кругу лиц. В прошлом это было более сложно, но с появлением сети интернет вы можете охватить любое количество клиентов, необходимо лишь подойти к этому профессионально.

Создание сайта компании
Madcatzz

Чтобы быть успешным сегодня, вы должны продавать свои услуги или продукцию как можно более широкому кругу лиц. В прошлом это было более сложно, но с появлением сети интернет вы можете охватить любое количество клиентов, необходимо лишь подойти к этому профессионально.

Как создать форму обратной связи с возможностью загрузки и отправки файла на почту PHP

В этой статье вы узнаете, как создать форму обратной связи (мы будем получать email пользователя), которая предоставляет пользователю возможность прикрепить и отправить на сервер свой файл. Также в этой статье вы узнаете, как проверить тип и размер загруженного файла.

Html формы с полем отправки файла

Html формы с полем отправки файла представлен ниже. При клике по кнопке » browse » пользователь получает возможность выбрать файл на своей локальной машине.

Форма будет выглядеть следующим образом:

Обратите внимание, что в атрибутах формы мы указали enctype=»multipart/form-data» . Это скажет браузеру, что форма может быть использована для отправки файлов. Также мы добавили поля » name » и » email » с целью собрать как можно больше информации о пользователе. Затем идет поле отправки файла.

При клике по кнопке submit , данные, включая данные о посылаемом файле, отправятся в файл-обработчик, путь к которому мы указали в атрибуте формы action .

Получаем информацию о загруженном файле

Сперва мы проверим полученные данные, затем, в случае успешной проверки, отправим данные на электронную почту.

Всю информацию о загруженных файлах можно получить при помощи массива $_FILES .

Содержимое массива $_FILES для нашего примера приведено ниже. Обратите внимание, что значение атрибута name (у нас оно равно uploaded_file ) в поле выбора файла может быть любым.

  • $_FILES[‘uploaded_file’][‘name’]
    Оригинальное имя файла на компьютере пользователя.
  • $_FILES[‘uploaded_file’][‘type’]
    Mime-тип файла, в случае, если браузер предоставил такую информацию. Пример: «image/gif». Этот mime-тип не проверяется в PHP, так что не полагайтесь на его значение без проверки.
  • $_FILES[‘uploaded_file’][‘size’]
    Размер в байтах принятого файла.
  • $_FILES[‘uploaded_file’][‘tmp_name’]
    Временное имя, с которым принятый файл был сохранен на сервере.
  • $_FILES[‘uploaded_file’][‘error’]
    Код ошибки, которая может возникнуть при загрузке файла. Этот элемент был добавлен в PHP 4.2.0

Получаем имя, тип и размер загруженного файла:

Как видите, информация о загруженном файле доступна через массив $_FILES .

Проверяем размер и тип расширения загруженного файла

Предположим, что получаемый файл должен быть изображением (» jpg «, » jpeg «, » gif «, » bmp «) и не должен превышать 100 Kb. Тогда наш код будет выглядеть так:

В вышеприведенном коде мы проверяем размер и тип файла. Максимально допустимый размер файла равен 100 KB ( $max_allowed_file_size ). Массив $allowed_extensions содержит названия всех допустимых расширений файла. Таким образом, расширение файла проходит проверку на соответствие значениям массива $allowed_extensions . При обнаружении ошибок переменной $error присваивается соответствующая запись.

Копируем загруженный файл

Пришло время отправить загруженный файл на почту администратора.

Сперва мы должны скопировать файл в папку на сервере. (По окончанию работы скрипта, в случае, если принятый файл не был переименован или скопирован в новую папку, он будет автоматически удален из временной папки.)

Копируем загруженный файл в папку ‘ uploads ‘. Если вы хотите переименовать папку ( uploads ), обновите переменную $upload_folder .

Убедитесь, что папка ‘ uploads ‘ имеет права доступа 777. Файл сохранен на вашем сервере, и вы можете обратиться к нему в любой момент.

Отправляем письмо

Составим и отправим письмо на электронную почту администратора сайта (или кому хотите). Для отправки и компоновки письма будем использовать pear library (инструкцию по установке смотрите ниже). Pear классы PEAR::Mail и PEAR::Mail_Mime используются для отправки электронной почты с прикрепленными файлами.

Для начала мы должны подключить файлы pear library для этих классов:

Ниже приведен код компоновки и отправки письма:

Класс Mail_mime() поможет в создании MIME послания. В приведенном выше коде мы создали объект Mail_mime , обновили тело письма ( $message->setTXTBody($text); ) и добавили прикрепленный файл ( $message->addAttachment(file) ).

Прежде чем использовать классы PEAR необходимо установить PEAR на вашем сервере. Вот быстрый способ установить PEAR:
Скачайте инсталлятор PEAR

Сохраните файл как » pear-installer.php «. Загрузите этот файл на ваш сервер в любой каталог. Затем пропишите путь к файлу в вашем браузере:
http://www.yourdomain.com/pear-installer.php
Появится веб-интерфейс для установки PEAR на вашем сайте. Следуйте инструкции по установке. После установки Pear, найдите и установите пакеты » mail » и » mail_mime «.

Простая форма с загрузкой, скачать

Архив содержит простую форму с отправкой загруженного файла на почту.

PHP форма обратной связи

Вам нужна форма для обратной связи на сайте, но Вы не знаете, как ее сделать? Тогда этот урок специально для Вас.

Форма для обратной связи — незаменимая вещь, так как с ее помощью Ваши посетители всегда могут связаться с Вами. В данном уроке я Вас научу создавать такую форму с помощью PHP и jQuery.

Давайте начнем с простого. Нам понадобиться всего одна страница для формы, на которой будет находиться разметка формы, PHP для обработки и jQuery для проверки правильности введения данных в форму.

Шаг №1: создаем разметку формы

Давайте создадим страницу под названием contact.php (или можете выбрать любое произвольное название). Главное, чтобы расширение этого файла было .php. С помощью PHP нам не придется создавать несколько страниц, а будет достаточно всего одной.

Шаг №2: придайте форме стиля

Теперь нам необходимо все красиво оформить. Давайте вставим все стили в файл contact.php между тегами .


Шаг №3: проверьте форму с помощью jQuery

В самом начале мы уже подключили фреймворк jQuery в нашу страничку. Кроме этого нам необходимо еще подгрузить специальный плагин для проверки введеных данных и одну небольшую функцию. Все это выглядит так:

После этого нам необходимо внести некоторые коррективы в нашу форму. Если поле обязательное, необходимо добавить >

После всех манипуляций у Вас должно получиться что-то наподобие этого:

Шаг №4: обработка и отправка формы

Настало время добавить немного PHP магии нашей форме. Поместите следующий код как можно выше в Вашем документе. Вы, наверное, спрашиваете себя, зачем нам проверять все поля формы еще раз с помощью PHP (ведь мы же уже проверили все с помощью jQuery)? Причина для этого есть, и она заключается в том, что даже если у Вашего посетителя будет отключен Javascript, он все равно сможет воспользоваться формой.

В коде есть комментарии, которые расскажут Вам что этот код делает. Также не забудьте поменять Email на свой (в примере указан name@yourdomain.com).

Вот и все! Теперь Вы знаете, как сделать форму обратной связи.

Единственный маленький недостаток: мне не удалось перевести на русский язык ошибки, которые всплывают, например, при введении неправильного Email. Дело в том, что эти сообщения находятся в зашифрованном виде в файле jquery.validate.pack.js. Если быть еще точнее, то они не зашифрованы, но разбросаны по всему файлу и при попытке внести коррективы возникают проблемы с кодировкой.

Если у меня получится это исправить, я обязательно напишу здесь :).

На сегодня все. Всем спасибо.

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: www.raymondselda.com
Перевел: Максим Шкурупий
Урок создан: 9 Мая 2009
Просмотров: 279288
Правила перепечатки

5 последних уроков рубрики «PHP»

Фильтрация данных с помощью zend-filter

Когда речь идёт о безопасности веб-сайта, то фраза «фильтруйте всё, экранируйте всё» всегда будет актуальна. Сегодня поговорим о фильтрации данных.

Контекстное экранирование с помощью zend-escaper

Обеспечение безопасности веб-сайта — это не только защита от SQL инъекций, но и протекция от межсайтового скриптинга (XSS), межсайтовой подделки запросов (CSRF) и от других видов атак. В частности, вам нужно очень осторожно подходить к формированию HTML, CSS и JavaScript кода.

Подключение Zend модулей к Expressive

Expressive 2 поддерживает возможность подключения других ZF компонент по специальной схеме. Не всем нравится данное решение. В этой статье мы расскажем как улучшили процесс подключение нескольких модулей.

Совет: отправка информации в Google Analytics через API

Предположим, что вам необходимо отправить какую-то информацию в Google Analytics из серверного скрипта. Как это сделать. Ответ в этой заметке.

Подборка PHP песочниц

Подборка из нескольких видов PHP песочниц. На некоторых вы в режиме online сможете потестить свой код, но есть так же решения, которые можно внедрить на свой сайт.

Простая форма обратной связи без перезагрузки страницы на PHP+jQuery

Я много видел разных мудреных реализаций форм обратной связи в Интернете и думаю, что даже заядлый программист не сразу разберется в работе такого кода. А зачем, собственно говоря, усложнять работу, если все можно сделать как никогда просто, не так ли?

Сегодня я хотел бы показать самую простую и на 100% рабочую реализацию формы обратной связи без перезагрузки страницы с использованием технологии AJAX (jQuery) и обработки/отправки данных на PHP.

Под простотой я подразумеваю наличие лишь текстовых полей. По желанию, вы можете внедрить чекбоксы, селекты, прикрепление файлов и даже свою капчу.

Технология AJAX, если вы еще не знаете, позволяет без перезагрузки страницы передать значения в PHP-скрипт (и не только), где, уже приняв эти данные, можно произвести необходимые операции.

Если вы не сильно разбираетесь в сайтостроении или только начали освоение этой темы и нуждаетесь в добавлении одного из перечисленный функционалов – пишите об этом в комментариях, постараюсь помочь.

Простой пример формы обратной связи без перезагрузки страницы

Поскольку для отправки формы мы будем использовать PHP, то не стоит делать акцент на том, что на вашем хостинге должна быть его поддержка.

1. Первым делом сверстаем форму с нашими полями. CSS-стили мы упустим, так как сейчас нам это не так важно. В качестве полей сделаем «Имя», «E-mail» и поле для ввода сообщения:

Обратите внимание на элемент с классом «result» – в него мы будем выводить сообщения об ошибках или успешном отправлении сообщения.

2. Далее пишем скрипт, который соберет все данные с формы и отправит их в наш PHP-обработчик:

Скрипт вставляем перед закрывающим тегом

Обратная связь PHP скрипт – учимся понимать своих животных

Дата публикации: 2020-10-24

От автора: у всех людей собаки как собаки, а мой вообще ничего не хочет понимать! Хотя, когда зовешь есть, то он бежит самый первый на кухню. Сосед говорит, что я неправильно команды подаю псу, поэтому мне поможет обратная связь PHP скрипт для общения с животным.

С людьми легче!

Со своим псом я решил подождать, и для начала «потренироваться» на людях. Для реализации моего плана предлагаю заняться написанием формы для общения с пользователями ресурса. Немного «пофилософствуем». Форма для организации обратной связи должна иметь несколько полей:

Для ввода имени пользователя.

Кроме этого в ней может присутствовать поле для указания email отправителя. Но если форма предназначена для связи с пользователями ресурса, то запрос «мыла» лучше реализовать во время процедуры регистрации.

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC

В курсе 39 уроков | 15 часов видео | исходники для каждого урока

После этого полученный текст сообщения нужно отправить на сервер и где-то сохранить. Для этого мы создадим таблицу MySQL и скрипт формы обратной связи PHP, который будет заносить полученные данные в БД.

Форма для «взаимопонимания»

Начнем с главного элемента нашего проекта – формы. Вот коде ее разметки:

Так форма выглядит в браузере:

Создаем таблицу и записываем обращения пользователей


Теперь нам нужно создать таблицу для записи и хранения всех обращений пользователей. На практике перед этим должна проходить процедура авторизации или регистрации, но мы ее опустим. Отмечу, что при этом чаще всего используется одна и та же таблица (или взаимосвязанные между собой таблицы).

Структура той, которую создал я. Обратите внимание, что для столбца, где будет храниться сообщения (user_message) задан тип данных text.

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC

В курсе 39 уроков | 15 часов видео | исходники для каждого урока

Форум PHP программистов ► PHP практикум ► PHP для начинающих

Пейджер выключен!

Профиль
Группа: Пользователь
Сообщений: 2
Пользователь №: 43303
На форуме:
Карма:

ПОМОГИТЕ! Не отправляет и всё, я не силён в PHP.

Сообщений: 2642
Пользователь №: 37963
На форуме:
Карма: 29

Чтобы Мужики глаза не ломали, делайте так:

Профиль
Группа: Пользователь
Сообщений: 2
Пользователь №: 43303
На форуме:
Карма:

Подписаться на тему
Уведомление на e-mail об ответах в тему, во время Вашего отсутствия на форуме.

Подписка на этот форум
Уведомление на e-mail о новых темах на форуме, во время Вашего отсутствия на форуме.

Скачать/Распечатать тему
Скачивание темы в различных форматах или просмотр версии для печати этой темы.

Форма обратной связи для сайта: PHP-обработчик + Ajax + Валидация

Привет ребята. На связи Серёга. Знаю, что давно не писал — дела, дела. Да и сейчас, если честно, времени совсем нету. И форму будем делать не по моему уроку, а по урокам моего знакомого — Кротова Романа.

Создавать форму обратной связи для сайта мы будем последовательно. Поэтому эта статья будет разбита на 3 урока.

В первом видео — мы просто заведём её в HTML и создадим PHP-обработчик для отправки писем. Всё будет последовательно, с нуля и до результата. Так, что бы вы всё поняли, и смогли самостоятельно встроить нужные поля.

Во второй части Рома, покажет Вам как сделать Ajax-загрузку. То есть отправлять данные с формы без перезагрузки странички. Что, согласитесь, весьма удобно и современно.

Ну и в третьей (урок готовится — позже здесь будет ссылка), мы встроим проверку на валидацию. Не средствами браузера, а при помощи специальных скриптов.

Видео 1. Создание формы обратной связи для сайта.

Обращаю внимание! Что бы форма заработала — необходимо, что бы ваш хостинг поддерживал PHP.

Если у вас возникнут вопросы касательно непонятных моментов в написании обработчика формы для отправки писем — не стесняйтесь, задавайте их в комментариях.

Код из урока по созданию формы обратной связи

Вот что получилось в итоге в файле index.php

Напоминаю, что в нём содержится простенькая форма обратной связи. Без оформления и прочих прибамбасов. Что бы не нагружать Вас лишней информацией.

Содержимое файла submit.php:

Здесь осуществляется базовая проверка формы на заполненность, что бы не отправлять пустые сообщения. Если всё «гуд» — письмо отправляется. И идёт переадресация на страницу-уведомление об успешном отправлении письма.

Ну а саму страницу уведомление не вижу смысла здесь размещать. Там базовая структура HTML-документа и всего одна строчка текста.

Видео 2. Ajax — отправка письма без перезагрузки страницы.

Для прохождения второго урока, нам понадобится библиотека jQuery. Мы её подключали с официального сайта jquery.com (ссылка ведет на страницу загрузки).

Ребята, решил что не буду публиковать код формы обратной связи. Какой смысл в этом, если есть ссылка на оригинал автора??

Видео 3. Валидация — проверка формы на правильность заполнения.

Как сделать чтобы отправляло два письма — тому, кто пишет (он вводит свой мейл) и администратору системы (магазина). Еще добавление файлов к форме отправки

mail(«drugoisvet@gmail.com, admin@krotovroman.ru», $theme .

Здравствуйте, Сергей и Роман!

Спасибо за Ваши уроки!

Но . — большая просьба: покажите как поставить капчу и как пристегнуть картинку, видео ??

Причем так, чтобы они не просто попадали на сервер, а на необходимы почтовый адрес.

По вложению файлов и капче — надо отдельное видео записывать.

Роман ждем уроков по капче. Вообще было бы круто если бы Вы полностью закрыли вопрос обратной связи. В интернете встречаются уроки кусочками. Вот например, надо вставить капчу, кому то надо прикрепить файл для отправки, или добавить выпадающий список и чекбоксы и т.д. Как сделать красивое всплывающее сообщение на аяксе «Отправлено».

Тут получается полный курс. В интернете толковой информации по всем вопросам в одном курсе не видел. Приходится все собирать крупицами. Было бы здорово полностью всесторонне рассмотреть вопрос формы обратной связи.

Есть полный курс у меня Мастер PHP PRO.

Напишите мне в личку, я скину: https://vk.me/krotovromanpublic

Спасибо за урок. Ждем новых уроков. Просмотрел урок бегло. Так как не закончил ещё изучение «верстаем на 5 с плюсом». Урок впринципе понятен. Так как сам программирую на языке мкл5. Тема Ваша интересна. После изучения буду изучать Ваш курс «Видеокурс «Мастер PHP»».

Хорошо. Всегда рад видеть!

Посмотрел уроки, возникло пару вопросов:

1. Зачем назначать документу расширение .php, если там чистый html?

2. Почему нет закрытия кода в файле submit.php?


Здравствуйте Кирилл. Спасибо за вопросы!

1. Урок по PHP а не по HTML и я заранее на будущее сразу создаю PHP файл, потому что в следующих уроках это пригодится. Но в данном конкретном случае, действительно, Вы можете делать форму в HTML файле, потому что php код в нем не используется.

2. Тега закрытия в конце файла submit.php нет, потому что он не требуется там. Там чистый PHP без примеси HTML. Если комбинировать в файле HTML код со вставками PHP, то PHP теги надо закрывать. Если будете дальше смотреть мои уроки по этой теме, возможно, увидите такие примеры.

С уважением, Кротов Роман.

Здравствуйте! Как сделать, чтобы сообщение об отравке исчезало через несколько секунд?

Добрый день. Прошу простить, но скачала форму , установила на локальный сервер. И ничего не работает. помогите разобраться почему. пожалуйста

Сделайте все точно так же как в видеоуроке и всё получится.

В крайнем случае создайте тему на моем форуме: https://support.krotovroman.ru/

И со скриншотами покажите по порядку что вы делали и какие ошибки появляются.

Добрый день. Установил форму на сайт и в консоли появилась ошибка Uncaught TypeError: $.validate is not a function Подскажите, с чем она связана и как ее устранить?

Разобрался. Нужно добавлять скрипты именно в таком порядке

Ошибка исчезла, но форма все равно не реагирует. Не проверяет заполнение поля и не отправляет.

Помогите исправить обработчик в форме обратной связи. К сожалению сам с РНР, мягко говоря, на Вы.

А проблема в следующем.

У нас только один почтовый ящик и в его настройках, на сервере хостинга, указана переадресация на почту Яндекса на fanat1959@yandex.ru.

Но пересылается на Яндекс только примерно половина писем, остальные нет. Т.е. я ВСЕ входящие письма вижу в ящике на хостинге, а на почте Яндекса — только половину.

В службе поддержки хоста написали (вкратце):

ВСЕ письма поставлены в очередь почтовой службы Яндекс, однако по части из них получены отказы в доставке, поскольку форма обратной связи сайта установила в письме в качестве заголовка отправителя email посетителя сайта, например ниже «inek@flowers56.ru», «aj.sidorov@physics.msu.ru», или пустое.

Письмам с такими отправителями в заголовках письма, при отправке с любого, не только с нашего виртуального хостинга, будет отказано в доставке почтовой службой Яндекс для предотвращения спуфинга — подделки отправителя письма.

Рекомендуем пересмотреть исходный код формы обратной связи и изменить его таким образом, чтобы электронный адрес посетителя сайта добавлялся, например, в заголовок «Reply-to:».

Вот часть кода обработчика на РНР:

$mail_addr = array («info@fanatgusyatnik.ru»); // сюда необходимо подставить СУЩЕСТВУЮЩИЙ на сервере email, с него будет рассылка

#header («Location: sm_success.htm»);

header («Location: sm_failed.htm»);

$mail_subj = «Вопрос к Фанат Гусятник — «.$p[«Subject»];

$sender_mail = array («E_mail» => «E-mail»);

foreach ($sender_mail as $key => $item)

if (isset($p[$key]) && chop($p[$key]))

$mail_head = «From: «.»\n»;

$mail_head .= «Content-Type: multipart/mixed; boundary=»».$mail_bond.»»».»\n»;

$mail_body = «—«.$mail_bond.»\n».»Content-Type: text/plain; charset=Windows-1251″.»\n»;

$mail_body .= «Content-Transfer-Encoding: 8bit».»\n\n»;

$mail_body .= ‘== Новое письмо с сайта Фанат-Гусятник ==’.»\n»;

Подскажите пожалуйста куда и что прописать в «Reply-to:».

Доброго времени суток. У меня проблема со скриптом. установил полностью скаченный скрипт на локальный сервер всё сработало. установил на сервер где расположен сайт выдаёт «ошибка при отправке сообщения», при этом я для проверки создал отдельную директорию и ничего не менял кроме e-mail адреса. дал права всем файлам 777. но всё тщетно. в чём может быть проблема?

1. При открытии письма не работают переносы строк. Вся информация идет в одну строку http://joxi.ru/xAeNPoLup7K3vr. Как можно исправить такое.

2. Очень актуальный вопрос по созданию нескольких обратных форм на одной странице. Скажем, есть лендинг и на него необходимо разместить три формы обратной связи. Также следует отслеживать нажатия на кнопку по каждой форме. То есть им присваивается личный идентификатор.

Вы прекрасно показали и рассказали, как сделать одну форму на странице. А если надо несколько, тогда что получается необходимо делать несколько index.php и submit.php. что ли дублировать форму несколько раз в корне сайта. Или есть возможность как-то объединить эти формы в одном файле?

Большая просьба помочь в этом вопросе.

Подскажите как сделать чтобы на почту приходило название объекта которому направляется письмо, чтобы я тоже мог видеть кому именно пришло письмо.

Суть в том, что на сайте много страниц и на каждой свой адрес получателя+моя почта. Так вот когда мне приходит копия письма я не знаю кому был отправлен оригинал. Чтобы файл с PHP был один.

Подскажите как прописать путь от js к submit.php если они находятся в разных папках на сервере?

Здравствуйте! Спасибо за Ваш урок! Все получилось, но не могу сообразить только одно.

Есть форма и при нажатии на кнопку выполняется скрипт JS:

var vz = «f»;// это так для примера

// само исполнение при нажатии на кнопку

$(this).val(«Отправляется. » ); // Перед отправкой меняем название кнопки. Это работает

$.post( // три параметра метода Post

«submit.php», // 1-ый параметр — путь до файла submit.php

// Как написать код , я думаю что здесь, что бы результат передавался в переменную

// в переменную vz и далее название кнопки изменилось . .

$(this).val(vz) ; // Текст кнопки

Вопрос в следующем.Как из функции function (vozvrat) результат присвоить переменной VZ , что бы на кнопке отображались соответствующие надписи из файла submit.php ( видеоурок 2), как у Вас?

Доброго времени суток. Урок очень полезный и я такую форму с доработками установил на свой сайт. Сейчас столкнулся с такой проблемой. На странице где форма обратной связи я сделал еще одну форму для добавления комментариев с использованием бд. Проблема в выводе результата PHP проверки, так как он выводится в блок div одновременно на двух формах. Подскажите как их разделить.

Warning: mail(): Failed to connect to mailserver at «localhost» port 25, verify your «SMTP» and «smtp_port» setting in php.ini or use ini_set() in D:\xampp\htdocs\testform\submit.php on line 17

Я свою почту указал. На локальном сервере xampp такая ошибка

Форма обратной связи без плагинов (Страница 1 из 6)

Чтобы отправить ответ, вы должны войти или зарегистрироваться

Сообщений с 1 по 25 из 143

1 Тема от pavlexx 2015-07-26 14:15:43 (2020-06-24 18:35:50 отредактировано pavlexx)

  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Тема: Форма обратной связи без плагинов

День добрый всем!

Решил сделать форму обратной связи не прибегая ко всяким плагинам.
Так как для верстки я использую framework UiKit — форма сделана на нем же.
Адаптировать под другой framework не составит особого труда.

Все началось с того, что для одного проекта заказчик выставил требования которые нельзя реализовать плагинами Getsimple Contact и p01contact не покопавшись в них.
Поэтому я решил, что проще один раз потратить время и сделать форму самому, чем разбираться в «чужих» трудах.
Собственно форму можете посмотреть на тестовом сайте.
Можете ее протестировать, письмо придет на указанный в форме адрес.
Исходные файлы пока не размещаю, если будет интересно такое решение и кому-то пригодиться — тогда прикреплю архив со всем необходимым.
Да, забыл упомянуть, что форма адаптивна. Вариант пока не окончательный, смотрю что еще можно сделать, улучшить.

Хотелось бы услышать ваше мнение: что можно доделать, что исправить, есть ли ошибки.

UPD. Скачать тему с формой можно по ссылке https://yadi.sk/d/BMrETi6qi6egB
Все файлы специально не стал сжимать, чтобы можно было посмотреть код и использовать в своих разработках!
Шаблон с формой обратной связи называется template-form.php
Пользуйтесь на здоровье!

UPD. 2 Изменил положение сообщений об ошибках и добавил иконки. Возможно так будет лучше!?

UPD. 3 Добавил капчу, немного переписал скрипты.

UPD. 4 Переписал скрипт, теперь поля «не прыгают». Предложил свой вид страницы контактов.
Также разместил пример «Политики конфиденциальности».
Файлы пока не размещаю и не обновляю ссылку, если будет интерес к такому варианту — выложу шаблон и обновленную форму!

UPD. 5 Обновленную форму и подробное описание смотрите здесь!

UPD. 6 Новая форма с новым валидатором и описанием изменений здесь!

UPD. 7 Доработанная форма, с возможностью использования нескольких экземпляров на одной странице и добавления своих полей без правки скрипта, и подробное описание расположены здесь!

UPD. 8 Релиз формы обратной связи, версия 1.0!

Цукерберг рекомендует:  Сайт - Нужна помощь
Понравилась статья? Поделиться с друзьями:
Все языки программирования для начинающих