Расследование form php. Формы в PHP. Предварительно определенные переменные

Ни для кого не является секретом, что наиболее распространенным способом взаимодействия html-страницы с сайтом является форма. Форма (то есть, html-элемент образуемый тегом form) используется и бесплатными почтовыми службами, электронными магазинами и многими другими типами сайтов.

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

Текстовые поля

Под текстовыми полями в этой статье понимаются элементы, создаваемые тегам input со значением параметра type равным text и тегом textarea . Организовать обработку формы состоящей из нескольких таких полей проще всего. На листинге ниже приведен листинг с html-разметкой для такой формы.

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

n"; ?>

Переключатели

Переключателями (checkbox ) в этой статье называются элементы, создаваемые тегам input со значением параметра type равным checkbox . Форма для использования переменного количества «переключателей » строится абсолютно так же. Обратите внимание, что выбор конкретного значения переключателя (то есть значение свойства value) не важен. Пример приведен в листинге ниже:

Однако обработка такой формы отличается от обработки, описанной для текстовых полей. В данном случае необходимо определить, включил или нет посетитель сайта тот или иной переключатель. Если включил — то соответствующий элемент массива существует, если нет — то отсутствует. В следующем листинге приведен пример PHP сценария, который распечатывает включенные переключатели:

Радио-кнопки

Перед тем как описывать обработку радио-кнопок необходимо вспомнить, как они работают. Суть радио-кнопок (элементы созданные тегами input со значением параметра type равным radio ) заключается в том что, выбирая одну кнопку, пользователь автоматически снимает выделение с другой кнопки из этого же набора. Кнопки объединяются в набор очень просто: у всех кнопок в наборе одно и тоже имя.

А вот значения (то есть параметры value ) у кнопок в наборе — разные. И на сайт будет отправлено значение выбранной кнопки с именем набора. Так же как и в случае с текстовыми полями и переключателями имена наборов радио-кнопок должны оформляться как имена элементов массива в PHP. Пример такой формы приведен в следующем листинге:

Обработка радио-кнопок объединяет идеи, использование при обработке, как текстовых полей, так и переключателей. Если автор html-страницы не установил значение по умолчанию, а пользователь не выбрал определенную кнопку в наборе радио-кнопок, то данный элемент будет отсутствовать в массиве (как для переключателей).

Всем доброго времени суток. На связи Алексей Гулынин. В прошлой статье вы узнали о том, что такое сериализация в php . В данной статье я бы хотел рассказать о том, как работать с формами в PHP . Язык PHP предназначен для программирования web-сценариев, и обработка форм занимает, пожалуй, самое главное место в этом процессе. Сейчас уже и не встретить сайтов, на которых не было бы, к примеру, регистрации или формы обратной связи, или опросника. Форумы, интернет-магазины, добавление комментария, отправка сообщения в социальной сети — всё это обработка данных, помещенных в поля формы. Давайте на примере разберемся, как обрабатывать формы на PHP .
Будем реализовывать простую задачу: необходимо создать 2 поля (имя и фамилия), передать эти данные скрипту action.php , в результате должно выйти приветствие "Добро пожаловать, фамилия имя" . Кто забыл, как создаются формы, и какие там есть поля, можно посмотреть . Создадим файл test.html :

Обращаю ваше внимание, что файл action.php (в нашем случае) должен находиться в одной папке с файлом test.html . Тут можно указывать как относительные, так и абсолютные пути. Будьте внимательны, многие ошибки связаны с неправильным указанием пути до скрипта-обработчика формы.

Создадим файл action.php со следующим содержимым:

Если мы сейчас откроем файл test.html , заполним поля формы и нажмём на кнопку, то попадём в файл action.php , где будет выведено сообщение. В данном случае браузер обращается к скрипту action.php и передает ему, через знак "?" все значения атрибутов name , расположенных внутри тегов , разделенных символом & . Обратите внимание, что подставляется вместо $_SERVER .

Нашу задачу мы можем решить, разобрав строку QUERY_STRING с помощью стандартных функций по работе со строками в PHP, но лучше воспользоваться другим механизмом — это использование массива $_REQUEST . Все данные, которые получены из полей формы, PHP помещает в массив $_REQUEST, не зависимо от того, каким способом были переданы данные: POST или GET (узнать можно через $_SERVER["REQUEST_METHOD"] ). Напоминаю чем эти способы отличаются:

Метод GET является открытым, метод POST является закрытым, т.е. они отличаются способом передачи параметров. Пример:

1) Если мы используем метод post: mysite.ru/request.php.
2) Если мы используем метод get: mysite.ru/request.php?myname=»Alex»&surname=»Gulynin».

Также, помимо массива $_REQUEST, PHP создаёт массивы $_GET и $_POST . Давайте теперь реализуем нашу задачу, на основе полученных знаний:

Если мы сейчас заполним форму и нажмём на кнопку, то увидим, что скрипт action.php приветствует нас по фамилии и имени. Всё работает корректно.

Здесь всё хорошо, но если мы изменим название скрипта, то нужно будет вносить изменения в файл test.html . Давайте модифицируем файл action.php, так, чтобы, обращаясь к нему либо выводилась форма, когда мы ничего не отправили, либо приветствие, когда мы нажали кнопку:

Теперь мы не зависим от имени скрипта, т.к. задаем его через переменную окружения $_SERVER["SCRIPT_NAME"] . Конструкция =$_SERVER["SCRIPT_NAME"]?> равнозначна конструкции .
Помимо переменной окружения SCRIPT_NAME существует множество других.

HTML формы — сложные элементы интерфейса. Они включают в себя разные функциональные элементы: поля ввода и , списки <select> , подсказки и т.д. Весь код формы заключается в элемент <form> .</p> <p>Большая часть информации веб-форм передаётся с помощью элемента <input> . Для ввода одной строки текста применяется элемент <input type="text"> , для нескольких строк - элемент <textarea> . Элемент <select> создает выпадающий список.</p> <p>Элемент <label> создаёт надписи к полям формы. Существует два способа группировки надписи и поля. Если поле находится внутри элемента <label> , то атрибут for указывать не нужно.</p><p> <label for="lastname">Last Name</label><input type="text" id="lastname"> <input type="text" id="lastname"><label for="lastname">Last Name</label> <label>Last Name<input type="text" name="lastname"></label> </p><p>Поля формы можно разделять на логические блоки с помощью элемента <fieldset> . Каждому разделу можно присвоить название с помощью элемента <legend> .</p><p> <fieldset> <legend>Контактная информация</legend> <label>Имя<input type="text" required></label> <label>E-mail<input type="email" required></label> </fieldset> <br><img src='https://i0.wp.com/html5book.ru/wp-content/uploads/2015/05/fieldset.png' width="100%" loading=lazy> Рис. 1. Группировка полей формы </p><p>Чтобы сделать форму более понятной для пользователей, в поля формы добавляют текст, содержащий пример вводимых данных. Такой текст называется подстановочным и создаётся с помощью атрибута placeholder .</p> <p>Обязательные для заполнения поля также необходимо выделять. До появления HTML5 использовался символ звездочки * , установленный возле названия поля. В новой спецификации появился специальный атрибут required , который позволяет отметить обязательное поле на уровне разметки. Этот атрибут дает указание браузеру (при условии, что тот поддерживает HTML5), указание не отправлять данные после нажатия пользователем кнопки отправить, пока указанные поля не заполнены.</p><p> <input type="text" required placeholder="Ваше имя"> </p><p>Для изменения внешний вид текстового поля при получении фокуса, используется псевдокласс focus . Например, можно сделать фон текущего поля более темным или добавить цветную рамку, чтобы оно выделялось среди остальных:</p><p>Input:focus { background: #eaeaea; } </p><p>Ещё один полезный html5-атрибут — атрибут autofocus . Он позволяет автоматически установить фокус на нужном начальном поле для элементов <input> и <textarea> (только в один элемент каждой формы).</p> <h2>Пример создания формы регистрации</h2> <p><b>HTML разметка </b></p><p> <div class="form-wrap"> <div class="profile"><img src='https://i0.wp.com/сайт/wp-content/uploads/2016/10/profile-image.png' loading=lazy> <h1>Регистрация</h1> </div> <form method="post" action="form.php"> <div> <label for="name">Имя</label> <input type="text" name="name" required> </div> <div class="radio"> Пол <label> <input type="radio" name="sex" value="мужской">мужской <div class="radio-control male"></div> </label> <label> <input type="radio" name="sex" value="женский">женский <div class="radio-control female"></div> </label> </div> <div> <label for="email">E-mail</label> <input type="email" name="email" required> </div> <div> <label for="country">Страна</label> <select name="country"> <option>Выберите страну проживания</option> <option value="Россия">Россия</option> <option value="Украина">Украина</option> <option value="Беларусь">Беларусь</option> </select> <div class="select-arrow"></div> </div> <button type="submit">Отправить</button> </form> </div> </p><p><b>Примечание </b><br> action="form.php" — ссылка на файл обработчика формы. Создайте файл в кодировке UTF-8, закачайте его на сервер и замените action="form.php" на путь к файлу на вашем сервере.</p> <br><img src='https://i0.wp.com/html5book.ru/wp-content/uploads/2016/10/form-default.png' width="100%" loading=lazy> Рис. 2. Внешний вид формы по умолчанию <p>Как видно из рисунка, каждый элемент формы имеет стили браузера по умолчанию. Очистим стили и оформим элементы формы.</p><p>Form-wrap { width: 550px; background: #ffd500; border-radius: 20px; } .form-wrap *{transition: .1s linear} .profile { width: 240px; float: left; text-align: center; padding: 30px; } form { background: white; float: left; width: calc(100% - 240px); padding: 30px; border-radius: 0 20px 20px 0; color: #7b7b7b; } .form-wrap:after, form div:after { content: ""; display: table; clear: both; } form div { margin-bottom: 15px; position: relative; } h1 { font-size: 24px; font-weight: 400; position: relative; margin-top: 50px; } h1:after { content: "\f138"; font-size: 40px; font-family: FontAwesome; position: absolute; top: 50px; left: 50%; transform: translateX(-50%); } /********************** стилизация элементов формы **********************/ label, span { display: block; font-size: 14px; margin-bottom: 8px; } input, input { border-width: 0; outline: none; margin: 0; width: 100%; padding: 10px 15px; background: #e6e6e6; } input:focus, input:focus { box-shadow: inset 0 0 0 2px rgba(0,0,0,.2); } .radio label { position: relative; padding-left: 50px; cursor: pointer; width: 50%; float: left; line-height: 40px; } .radio input { position: absolute; opacity: 0; } .radio-control { position: absolute; top: 0; left: 0; height: 40px; width: 40px; background: #e6e6e6; border-radius: 50%; text-align: center; } .male:before { content: "\f222"; font-family: FontAwesome; font-weight: bold; } .female:before { content: "\f221"; font-family: FontAwesome; font-weight: bold; } .radio label:hover input ~ .radio-control, .radiol input:focus ~ .radio-control { box-shadow: inset 0 0 0 2px rgba(0,0,0,.2); } .radio input:checked ~ .radio-control { color: red; } select { width: 100%; cursor: pointer; padding: 10px 15px; outline: 0; border: 0; background: #e6e6e6; color: #7b7b7b; -webkit-appearance: none; /*убираем галочку в webkit-браузерах*/ -moz-appearance: none; /*убираем галочку в Mozilla Firefox*/ } select::-ms-expand { display: none; /*убираем галочку в IE*/ } .select-arrow { position: absolute; top: 38px; right: 15px; width: 0; height: 0; pointer-events: none; /*активизируем показ списка при нажатии на стрелку*/ border-style: solid; border-width: 8px 5px 0 5px; border-color: #7b7b7b transparent transparent transparent; } button { padding: 10px 0; border-width: 0; display: block; width: 120px; margin: 25px auto 0; background: #60e6c5; color: white; font-size: 14px; outline: none; text-transform: uppercase; } /********************** добавляем форме адаптивность **********************/ @media (max-width: 600px) { .form-wrap {margin: 20px auto; max-width: 550px; width:100%;} .profile, form {float: none; width: 100%;} h1 {margin-top: auto; padding-bottom: 50px;} form {border-radius: 0 0 20px 20px;} } </p><p><b>Файл form.php </b></p><p> <?php $name = trim(strip_tags($_POST["name"])); $sex = trim(strip_tags($_POST["sex"])); $email = trim(strip_tags($_POST["email"])); $country = trim(strip_tags($_POST["country"])); $subject = "Регистрация на сайте url_вашего_сайта"; $msg = "Ваши данные формы регистрации:\n" ."Имя: $name\n" ."Пол: $sex\n" ."Ваш email: $email\n" ."Страна: $country"; $headers = "Content-type: text/plain; charset=UTF-8" . "\r\n"; $headers .= "From: Ваше_имя <ваш_email>" . "\r\n"; $headers .= "Bcc: ваш_email". "\r\n"; if(!empty($name) && !empty($sex) && !empty($email) && !empty($country) && filter_var($email, FILTER_VALIDATE_EMAIL)){ mail($email, $subject, $msg, $headers); echo "Спасибо! Вы успешно зарегистрировались."; } ?> </p><p><b>Примечание </b><br> В переменной $subject укажите текст, который будет отображаться как заголовок письма;<br> Ваше_имя — здесь вы можете указать имя, которое будет отображаться в поле «от кого письмо» ;<br> url_вашего_сайта замените на адрес сайта с формой регистрации;<br> ваш_email замените на ваш адрес электронной почты;<br> $headers .= "Bcc: ваш_email". "\r\n"; отправляет скрытую копию на ваш адрес электронной почты.</p> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> </div> </article> </div> </div> <div id="secondary"> <aside id="search-2" class="widget widget_search clearfix"> <form action="/" class="search-form searchform clearfix" method="get"> <div class="search-wrap"> <input type="text" placeholder="Поиск" class="s field" name="s"> <button class="search-icon" type="submit"></button> </div> </form> </aside> <aside id="recent-posts-2" class="widget widget_recent_entries clearfix"> <h3 class="widget-title"><span>Свежие записи</span></h3> <ul> <li> <a href="/the-sounds-and-music/nakrutka-chitatelei-v-tvittere-za-5-minut-effektivnaya-nakrutka-folloverov-v/">Эффективная накрутка фолловеров в твиттере онлайн</a> </li> <li> <a href="/reviews/kak-iz-djvu-sdelat-pdf-onlain-kak-konvertirovat-djvu-v-pdf-onlain-servisy-i/">Как конвертировать djvu в pdf: Онлайн сервисы и программы</a> </li> <li> <a href="/system-and-update/chto-delat-esli-vash-kompyuter-zarazhen-virusom-kak-ochistit-zarazhennyi/">Как очистить зараженный компьютер Очищение компьютера с помощью CCE и TDSSKiller</a> </li> <li> <a href="/security/garnitura-dlya-telefona-aifon-5s-deistvie-luchshie-bluetooth-garnitury-dlya-iphone/">Лучшие Bluetooth-гарнитуры для iPhone</a> </li> <li> <a href="/pots/informacionnaya-bezopasnost-v-seti-zametaem-cifrovoi-sled/">Кому принадлежит наш «цифровой след»?</a> </li> <li> <a href="/reviews/kuda-devaetsya-operativnaya-pamyat-potreblenie-operativnoi/">Потребление оперативной памяти Чем может быть занята оперативная память</a> </li> <li> <a href="/system-and-update/zashchishchennyi-smartfon-samsung-s4-active-samsung-galaxy-s4-active-obzor/">Samsung Galaxy S4 Active: обзор, технические характеристики и отзывы</a> </li> <li> <a href="/the-sounds-and-music/mac-ne-vidit-printer-kak-podklyuchat-printery-k-makbuku-podklyuchaem-printer-po/">Как подключать принтеры к макбуку</a> </li> </ul> </aside> <aside id="text-5" class="widget widget_text clearfix"> <div class="textwidget"> <script type="text/javascript" src="//vk.com/js/api/openapi.js?144"></script> <div id="vk_groups"></div> </div> </aside> <aside id="text-4" class="widget widget_text clearfix"> <div class="textwidget"> </div> </aside> <aside id="text-3" class="widget widget_text clearfix"> <div class="textwidget"> </div> </aside> </div> </div> </div> <footer id="colophon" class="clearfix"> <div class="footer-socket-wrapper clearfix"> <div class="inner-wrap"> <div class="footer-socket-area"> <div class="footer-socket-right-section"> </div> <div class="footer-socket-left-sectoin"> <div class="copyright">© 2024 <a href="/" title="olegshein.ru"><span>olegshein.ru</span></a>. Компьютерный клуб Олега Шейна.<br></div> </div> </div> </div> </div> </footer> <a href="#masthead" id="scroll-up"><i class="fa fa-chevron-up"></i></a> </div> <script type="text/javascript"> var q2w3_sidebar_options = new Array(); q2w3_sidebar_options[0] = { "sidebar": "colormag_right_sidebar", "margin_top": 10, "margin_bottom": 0, "stop_id": "", "screen_max_width": 0, "screen_max_height": 0, "width_inherit": false, "refresh_interval": 1500, "window_load_hook": false, "disable_mo_api": false, "widgets": ['text-3'] }; </script> <script type="text/javascript"> (function(w, doc) { if (!w.__utlWdgt) { w.__utlWdgt = true; var d = doc, s = d.createElement('script'), g = 'getElementsByTagName'; s.type = 'text/javascript'; s.charset = 'UTF-8'; s.async = true; s.src = ('https:' == w.location.protocol ? 'https' : 'http') + '://w.uptolike.com/widgets/v1/uptolike.js'; var h = d[g]('body')[0]; h.appendChild(s); } })(window, document); </script> <div style="text-align:left;" data-lang="ru" data-url="/global-blue-vozvrat-tax-free-v-minske/" data-background-alpha="0.0" data-buttons-color="#FFFFFF" data-counter-background-color="#ffffff" data-share-counter-size="12" data-top-button="false" data-share-counter-type="common" data-share-style="1" data-mode="share" data-like-text-enable="false" data-mobile-view="true" data-icon-color="#ffffff" data-orientation="fixed-left" data-text-color="#000000" data-share-shape="round-rectangle" data-sn-ids="fb.vk.tw.ok.gp.ps.mr.ln." data-share-size="30" data-background-color="#ffffff" data-preview-mobile="false" data-mobile-sn-ids="fb.vk.ok.wh.vb." data-pid="cmsvpolshuby" data-counter-background-alpha="1.0" data-following-enable="false" data-exclude-show-more="true" data-selection-enable="true" class="uptolike-buttons"></div> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/pwebcontact/media/bootstrap-2.3.2/js/bootstrap.min.js?ver=2.3.2'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/pwebcontact/media/js/jquery.validate.min.js?ver=1.15.0'></script> <script type='text/javascript'> /* <![CDATA[ */ var pwebcontact_l10n = pwebcontact_l10n || {}; pwebcontact_l10n.form = { "INIT": "Initializing form...", "SENDING": "Sending...", "SEND_ERR": "Wait a few seconds before sending next message", "REQUEST_ERR": "Request error: ", "COOKIES_ERR": "Enable cookies and refresh page to use this form" }; /* ]]> */ </script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/pwebcontact/media/js/jquery.pwebcontact.min.js?ver=2.3.0'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/simple-tooltips/zebra_tooltips.js?ver=4.4.13'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.5.1'></script> <script type='text/javascript'> /* <![CDATA[ */ var tocplus = { "visibility_show": "\u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c", "visibility_hide": "\u0441\u043a\u0440\u044b\u0442\u044c", "width": "Auto" }; /* ]]> */ </script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/table-of-contents-plus/front.min.js?ver=1509'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/wp-cloudy/js/wp-cloudy-ajax.js?ver=4.4.13'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/mistape/assets/js/modernizr.custom.js?ver=1.3.3'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/mistape/assets/js/mistape-front.js?ver=1.3.3'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/themes/colormag/js/jquery.bxslider.min.js?ver=4.1.2'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/themes/colormag/js/colormag-slider-setting.js?ver=4.4.13'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/themes/colormag/js/navigation.js?ver=4.4.13'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/themes/colormag/js/fitvids/jquery.fitvids.js?ver=20150311'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/themes/colormag/js/fitvids/fitvids-setting.js?ver=20150311'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/q2w3-fixed-widget/js/q2w3-fixed-widget.min.js?ver=5.0.4'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.4.13'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/easy-fancybox/fancybox/jquery.fancybox-1.3.8.min.js?ver=1.6.2'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/easy-fancybox/js/jquery.easing.min.js?ver=1.4.0'></script> <script type='text/javascript' src='https://olegshein.ru/wp-content/plugins/easy-fancybox/js/jquery.mousewheel.min.js?ver=3.1.13'></script> <div id="pwebcontact1" class="pwebcontact pweb-bottom pweb-offset-right pweb-slidebox pweb-theme-free pweb-labels-above pweb-horizontal" dir="ltr"> <div id="pwebcontact1_toggler" class="pwebcontact1_toggler pwebcontact_toggler pweb-closed pweb-theme-free"> <span class="pweb-text">Есть вопросы?</span> <span class="pweb-icon"></span> </div> <div id="pwebcontact1_box" class="pwebcontact-box pweb-slidebox pweb-theme-free pweb-labels-above pweb-horizontal pweb-init" dir="ltr"> <div class="pwebcontact-container-outset"> <div id="pwebcontact1_container" class="pwebcontact-container"> <div class="pwebcontact-container-inset"> <form name="pwebcontact1_form" id="pwebcontact1_form" class="pwebcontact-form" action="/" method="post" accept-charset="utf-8"> <div class="pweb-fields"> <div class="pweb-row"> <div> <div class="pweb-field-container pweb-field-name pweb-field-name"> <div class="pweb-label"> <label id="pwebcontact1_field-name-lbl" for="pwebcontact1_field-name"> Имя </label> </div> <div class="pweb-field"> <div class="pweb-field-shadow"> <input type="text" name="fields[name]" id="pwebcontact1_field-name" autocomplete="on" class="pweb-input" value="" data-role="none"> </div> </div> </div> </div> </div> <div class="pweb-row"> <div> <div class="pweb-field-container pweb-field-email pweb-field-email"> <div class="pweb-label"> <label id="pwebcontact1_field-email-lbl" for="pwebcontact1_field-email"> Email <span class="pweb-asterisk">*</span> </label> </div> <div class="pweb-field"> <div class="pweb-field-shadow"> <input type="email" name="fields[email]" id="pwebcontact1_field-email" autocomplete="on" class="pweb-input required" value="" data-role="none"> </div> </div> </div> </div> </div> <div class="pweb-row"> <div> <div class="pweb-field-container pweb-field-textarea pweb-field-message"> <div class="pweb-label"> <label id="pwebcontact1_field-message-lbl" for="pwebcontact1_field-message"> Сообщение <span class="pweb-asterisk">*</span> </label> </div> <div class="pweb-field"> <div class="pweb-field-shadow"> <textarea name="fields[message]" id="pwebcontact1_field-message" cols="50" rows="5" class="required" data-role="none">