Как отправить данные на сервер html

namespace FormEncode.Models < using System; using System.ComponentModel.DataAnnotations; public class Update < [Required] [MaxLength(140)] public string Status < get; set; >public DateTime Date < get; set; >> > 

namespace FormEncode.Controllers < using FormEncode.Models; using System; using System.Collections.Generic; using System.Net; using System.Net.Http; using System.Web; using System.Web.Http; public class UpdatesController : ApiController < static readonly Dictionaryupdates = new Dictionary(); [HttpPost] [ActionName("Complex")] public HttpResponseMessage PostComplex(Update update) < if (ModelState.IsValid && update != null) < // Convert any HTML markup in the status text. update.Status = HttpUtility.HtmlEncode(update.Status); // Assign a new ID. var updates[id] = update; // Create a 201 response. var response = new HttpResponseMessage(HttpStatusCode.Created) < Content = new StringContent(update.Status) >; response.Headers.Location = new Uri(Url.Link("DefaultApi", new < action = "status", >)); return response; > else < return Request.CreateResponse(HttpStatusCode.BadRequest); >> [HttpGet] public Update Status(Guid id) < Update update; if (updates.TryGetValue(id, out update)) < return update; >else < throw new HttpResponseException(HttpStatusCode.NotFound); >> > > 

Complex Type
 
 
Status 
 
 
 
Date 
 
 
 
 
 
 

POST http://localhost:38899/api/updates/complex HTTP/1.1 Accept: text/html, application/xhtml+xml, */* User-Agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0) Content-Type: application/x-www-form-urlencoded Content-Length: 47 status=Shopping+at+the+mall.&date=6%2F15%2F2012 

[HttpPost] [ActionName("Simple")] public HttpResponseMessage PostSimple([FromBody] string value) < if (value != null) < Update update = new Update() < Status = HttpUtility.HtmlEncode(value), Date = DateTime.UtcNow >; var updates[id] = update; var response = new HttpResponseMessage(HttpStatusCode.Created) < Content = new StringContent(update.Status) >; response.Headers.Location = new Uri(Url.Link("DefaultApi", new < action = "status", >)); return response; > else

=value 

$.post('api/updates/simple', < "": $('#status1').val() >); 

Simple Type
 
Status 

Ниже приведен скрипт для отправки значения формы. Единственное отличие от предыдущего сценария заключается в том, что аргумент передается в функцию post .

$('#form2').submit(function () < var jqxhr = $.post('api/updates/simple', < "": $('#status1').val() >) .success(function () < var loc = jqxhr.getResponseHeader('Location'); var a = $('', < href: loc, text: loc >); $('#message').html(a); >) .error(function () < $('#message').html("Error posting the update."); >); return false; >); 

Для отправки массива простых типов можно использовать тот же подход:

$.post('api/updates/postlist', < "": ["update one", "update two", "update three"] >); 

Отправка данных на сервер

Подскажите, как сделать так, чтобы форма, которую заполняет участник отравлялась на e-mail администратора?

Отслеживать
задан 12 сен 2011 в 4:43
145 1 1 золотой знак 4 4 серебряных знака 20 20 бронзовых знаков

2 ответа 2

Сортировка: Сброс на вариант по умолчанию

mail.php

if(isset($_POST['mess']))< //проверки на правильность данных $admin_mail = '[email protected]'; $subj = 'Новое сообщение'; $mess = htmlspecialchars($_POST['mess']); $headers = 'From: [email protected]' . PHP_EOL; $headers .= 'Content-type: text/plain; charset=utf-8' . PHP_EOL; if(mail($admin_mail, $subj, $mess, $headers)) < //сообщение было выслано >else < //ошибка при отправке >> 

Отслеживать
ответ дан 12 сен 2011 в 6:42
14.7k 1 1 золотой знак 26 26 серебряных знаков 48 48 бронзовых знаков

 @e-mail">

Отслеживать
ответ дан 12 сен 2011 в 5:28
Monstrs-Inc Monstrs-Inc
232 1 1 золотой знак 4 4 серебряных знака 14 14 бронзовых знаков

• html
• mysql

Важное на Мете

Похожие

Подписаться на ленту

Лента вопроса

Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.

Дизайн сайта / логотип © 2024 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2024.1.26.3951

Как отправлять запросы на сервер, при этом не перезагружая страницу

Ниже приведены несколько примеров, для которых может быть полезна отправка запросов на сервер без перезагрузки страницы:

1. Динамическое обновление содержимого страницы: например, приложения вроде Facebook и Twitter обновляют содержимое ленты новостей без перезагрузки страницы, используя AJAX.
2. Проверка допустимости формы: AJAX может использоваться для отправки данных формы на сервер для проверки их корректности, без перезагрузки страницы.
3. Поиск: AJAX может использоваться для предоставления результата поиска на основе параметров, введенных пользователем, без перезагрузки страницы.
4. Добавление товаров в корзину: AJAX может использоваться для добавления товаров в корзину без перезагрузки страницы.
5. Динамическое создание элементов на странице: AJAX может использоваться для создания элементов на странице на основе данных, полученных с сервера, без перезагрузки страницы.

Подключение js jquery

Для того, чтобы подключить js jquery к вашей HTML воспользоваться кодом ,который нужно вставить в теге :

Написание первого ALAX запроса

Чтобы отправить ALAX запрос , нужно вставить следующий js код на страницу:

$.ajax(< type: "POST", // Метод запроса url: "/musik/like/1", // url запроса data: < // Параметры для запроса 'id': id, >, success: function(response) < // Код который выполнится для удачного запроса console.log(response); >, error: function(response) < // Код который выполнится при ошибке запроса console.log(response); >>);

Это и весь код для выполнения асинхронного запроса ,который вставляется в тег или в раннее подключенный js файл

CSRFTOKEN

CSRF токен (Cross-Site Request Forgery) — это механизм защиты от атак подделки межсайтовых запросов.

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

CSRF токен решает эту проблему, добавляя уникальный токен к каждому запросу, который проверяется на сервере. Таким образом, если запрос не содержит действительного CSRF токена, сервер отклонит его. Это позволяет защитить веб-приложение от атак подделки межсайтовых запросов.

Тот, кто работает с Python Django, знает, что для отправки POST запросов нужен CSRF токен, поэтому нужно получить этот токен и вставить его в параметры запроса.

Функция для получения токена:

function getCookie(name) < /*"Эта функция для получения куки по имени" */ var cookieValue = null; if (document.cookie && document.cookie !== '') < var cookies = document.cookie.split(';'); for (var i = 0; i < cookies.length; i++) < var cookie = cookies[i].trim(); if (cookie.substring(0, name.length + 1) === (name + '=')) < cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); break; >> > return cookieValue; > 

Присваиваем переменной csrftoken значение CSRFTOKEN

var csrftoken = getCookie('csrftoken');

1. Затем мы используем $.ajaxSetup() для определения функции обратного вызова beforeSend , которая вызывается перед отправкой каждого асинхронного запроса. В этой функции мы проверяем, не является ли запрос типом GET , HEAD , OPTIONS или TRACE , и не является ли запрос пересечением доменов, и если нет, то мы устанавливаем заголовок X-CSRFToken в значение токена CSRF.

$.ajaxSetup( >

Передаем параметры в запрос ALAX

data: < 'X-CSRFToken': csrftoken>,

function getCookie(name) < var cookieValue = null; if (document.cookie && document.cookie !== '') < var cookies = document.cookie.split(';'); for (var i = 0; i < cookies.length; i++) < var cookie = cookies[i].trim(); // Найти имя куки, начинающееся с переданного имени if (cookie.substring(0, name.length + 1) === (name + '=')) < cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); break; >> > return cookieValue; > function like(id) < var csrftoken = getCookie('csrftoken'); $.ajaxSetup(> >); $.ajax(< type: "POST", // Метод запроса url: "/musik/like/1", // url запроса data: < // Параметры для запроса 'id': id, 'X-CSRFToken': csrftoken >, success: function(response) < // Код который выполнится для удачного запроса console.log(response); >, error: function(response) < // Код который выполнится при ошибке запроса console.log(response); >>); >

Обработчик на сервере

Обработчик асинхронного запроса и обычного ничем не отличаются, кроме возвращаемого объета.Так ,например обычный обработчик возвращает шаблон HTML,то обработчик асинхронного запроса должен возвращать json объект.Пример написан на Python Django.

def home(request): return render(request, 'main/home.html') #Возвращает обькт render (шаблон)

def like_musik(request, id): if request.method == "POST": #Логика функции return JsonResponse()#Возвращаем Json объект

Заключение

В ходе этой статьи мы узнали о технологии AJAX и научились при помощи него отправлять асинхронные запросы.

HTML: Отправка формы

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

 
Отправить 
 

После нажатия на кнопку «Отправить», данные будут переданы обработчику, который указан в атрибуте action (если не указан, то данные отправятся на эту же страницу). После отправки данных страница будет перезагружена.

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

Форма поиска
 
 Введите ваш запрос 
 В каком разделе искать? JS HTML CSS  Искать 
 

Если вы нажмёте на кнопку «Искать», то страница перезагрузится и данные должны будут уйти в обработчик на эту же страницу. Так как обработчика нет, то никаких видимых результатов, кроме перезагрузки страницы, не произойдёт.

Задание

Создайте форму, у которой файл с обработчиком данных лежит по адресу /people . Внутри формы расположите следующие элементы:

• 2 текстовых поля
• Список с возможностью множественного выбора
• Кнопку «Отправить»

Упражнение не проходит проверку — что делать? ��

Если вы зашли в тупик, то самое время задать вопрос в «Обсуждениях». Как правильно задать вопрос:

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

В моей среде код работает, а здесь нет ��

Тесты устроены таким образом, что они проверяют решение разными способами и на разных данных. Часто решение работает с одними входными данными, но не работает с другими. Чтобы разобраться с этим моментом, изучите вкладку «Тесты» и внимательно посмотрите на вывод ошибок, в котором есть подсказки.

Мой код отличается от решения учителя ��

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

В редких случаях бывает, что решение подогнано под тесты, но это видно сразу.

Прочитал урок — ничего не понятно ��

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

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