Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.12.2013, 05:32
Аспирант
Отправить личное сообщение для Riddik Посмотреть профиль Найти все сообщения от Riddik
 
Регистрация: 14.11.2013
Сообщений: 32

Sumbit формы
Вопрос не совсем по JS, а, возможно, по PHP.

Когда юзер ввёл данные формы и нажал Sumbit, как при этом остаться на этой же странице?

Форма - это просто отправка мыла, на мыло отправляю в php скрипте.
Но при этом загружается и страница sendmail.php.

Как сделать так, чтобы просто показать окно с сообщением вместо перехода на новую страницу?

<form action="sendmail.php" method="post">
		<p><input type="text" size="40" placeholder="Ваше имя" name="user"></p>			
		<p><input type="text" size="40" placeholder="E-mail" name="email"></p>
		<p><input type="text" size="40" placeholder="Тема письма" name="subj"></p>
		<p>Текст обращения<Br>
		<textarea placeholder="Текст обращения" name="text" cols="40" rows="6"></textarea></p>
		<p><input type="submit" value="Отправить" name="submit_form1"></p>						
	</form>


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head> 
<body >
<h3>Заявка успешно отправлена!</h3>
<?php	

if(isset($_POST['submit_form1']))
{	
	$name = $_POST['user'];
	$mail = $_POST['email'];
	$subj = $_POST['subj'];
	$body = "Имя отправителя: ".$name."\nE-mail отправителя: ".$mail."\n\nТекст письма:\n\n".$_POST['text'];		
	mail("mymain@gmail.com", $subj, $body, "Content-Type: text/plain; charset=utf-8\n");
	header("Refresh: 4; url=".$_SERVER['HTTP_REFERER']);
}
?>
Ответить с цитированием
  #2 (permalink)  
Старый 17.12.2013, 06:14
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

В нормальных браузерах можно так сделать:
<script>
function sendForm(form, success) {
    var request = new XMLHttpRequest();
    request.open(form.method, form.action);
    request.onreadystatechange = function() {
        if (request.readyState == request.DONE) {
            if (request.code == 200) {
                success(request.responseText);
            }
        }
    };
    request.send(new FormData(form));
}
</script>
<form onsubmit="return sendForm(this, alert), false" action....>
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 17.12.2013, 11:46
Аспирант
Отправить личное сообщение для Riddik Посмотреть профиль Найти все сообщения от Riddik
 
Регистрация: 14.11.2013
Сообщений: 32

Сообщение от danik.js
В нормальных браузерах можно так сделать:
Т.е. в IE ниже 9ки работать не будет?

Спасибо!
Ответить с цитированием
  #4 (permalink)  
Старый 17.12.2013, 12:33
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Riddik
Т.е. в IE ниже 9ки работать не будет?
К сожалению в 9 работать тоже не будет. Только начиная с 10.
Если нужна кроссбраузерность, то у тебя два пути:
1) Подключить либу jQuery, там есть .serialize() и $.ajax()
2) Вместо FormData написать функцию сериализации в строку.
Функция выглядит примерно так:

function isSubmittable(control) {
    var element = control.nodeName.toLowerCase();
    if (['select', 'textarea', 'keygen'].indexOf(element) > -1)
        return true;
    if (element == 'input') {
        if (['submit', 'button', 'image', 'reset', 'file'].indexOf(control.type) > -1)
            return false;
        if (['checkbox', 'radio'].indexOf(control.type) > -1 && !control.checked)
            return false;
        return true;
    }
    return false;
}
    
function serialize(form) {
    var segments = [];
    for (var i = 0, control; control = form.elements[i]; i++) {
        if (!control.name || control.disabled || !isSubmittable(control))
            continue;
        segments.push(encodeURIComponent(control.name) + '=' + encodeURIComponent(control.value));
    }
    return segments.join('&');
}


Код особо не тестил.

К сожалению костыля для FormData найти не удалось..
__________________
В личку только с интересными предложениями

Последний раз редактировалось danik.js, 17.12.2013 в 14:55.
Ответить с цитированием
  #5 (permalink)  
Старый 17.12.2013, 12:54
Аспирант
Отправить личное сообщение для Riddik Посмотреть профиль Найти все сообщения от Riddik
 
Регистрация: 14.11.2013
Сообщений: 32

Принцип понял - спасибо ещё раз!
Ответить с цитированием
  #6 (permalink)  
Старый 17.12.2013, 14:56
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Забыл проинициализировать i в коде, поправил.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #7 (permalink)  
Старый 17.12.2013, 15:32
Интересующийся
Посмотреть профиль Найти все сообщения от moskitos80
 
Регистрация: 11.08.2013
Сообщений: 28

Riddik, то что тебе нужно - можно реализовать вообще без JS, если конечно doctype позволит: загрузка нескольких файлов на сервер
Ответить с цитированием
  #8 (permalink)  
Старый 17.12.2013, 17:30
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

moskitos80, а причем тут загрузка файлов? И как аякс будет работать без JS по-твоему?
И кстати, разве doctype что-либо позволяет/запрещает?
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #9 (permalink)  
Старый 17.12.2013, 18:04
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

есть варианты можно в фрейме отправлять
или JsonP использовать и даже img если не нужно ответ получать
Ответить с цитированием
  #10 (permalink)  
Старый 17.12.2013, 18:09
Аспирант
Отправить личное сообщение для Riddik Посмотреть профиль Найти все сообщения от Riddik
 
Регистрация: 14.11.2013
Сообщений: 32

danik.js,
Вместо request.send(new FormData(form));
Вставил request.send(serialize(form));
Ничего не происходит, php скрипт не вызывается. Неправильно запрос формирую?

moskitos80,
спасибо, попробую так.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
проверка формы не работает в ie begelme Javascript под браузер 6 13.08.2013 01:00
Отправка данных формы AJAX`ом? Jopses jQuery 4 20.02.2013 12:34
Добовление формы еще Kuklavod jQuery 2 03.11.2011 15:12
Валидация формы dmsuslov jQuery 4 05.11.2010 16:12
Простая проверка формы. Добавить "динамики". Jurasmi Элементы интерфейса 3 07.04.2010 16:48