Форум программистов, компьютерный форум, киберфорум
Наши страницы
JavaScript
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.75/133: Рейтинг темы: голосов - 133, средняя оценка - 4.75
Rock-n-rolla
2 / 2 / 0
Регистрация: 02.02.2012
Сообщений: 35
1

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

08.11.2012, 14:40. Просмотров 24630. Ответов 8
Метки нет (Все метки)

Сабж.
Нужно теперь реализовать Submit формы без перезагрузки страницы. Как это можно сделать, подскажите пожалуйста.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
08.11.2012, 14:40
Ответы с готовыми решениями:

Отправка формы без перезагрузки страницы
Всем добрый день. На данный момент отправка формы реализована через Ajax. Все...

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

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

Отправка формы без submit
есть код <form id='spr' method=get name='sprv'> Выберете...

Страницы без перезагрузки!
Здравствуйте!Кратко напишу в чем нужна ваша помощь: Есть сайт и на нем есть...

8
WebMax 2.0
--\.founder./--
562 / 562 / 392
Регистрация: 20.10.2011
Сообщений: 867
08.11.2012, 14:48 2
Изучайте AJAX.
0
Para bellum
Эксперт PHP
4098 / 3048 / 983
Регистрация: 06.01.2011
Сообщений: 8,923
08.11.2012, 14:57 3
Это делается при помощи AJAX. Я использую библиотеку jQuery, в ней есть функция реализации ajax запросов. Скачать её можно отсюда: http://jquery.com. Документации в интернете полно. Привожу пример запроса:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script>
$(function(){
    $("#form").onsubmit(function(){
        // Преобразуем форму в массив
        var form_data = $("#form").serializeArray;
        
        $.ajax({
            url: 'тут адрес скрипта, куда делаем запрос',
            type: 'POST', // Делаем POST запрос
            data: form_data
        });
    });
});
</script>
 
<form action="#" id="form">
    <input type="text" name="text">
    <input type="submit" name="submit">
</form>
Добавлено через 52 секунды
Подробнее можно узнать тут: http://jquery.page2page.ru/index.php5/Ajax-запрос
0
Rock-n-rolla
2 / 2 / 0
Регистрация: 02.02.2012
Сообщений: 35
08.11.2012, 15:03  [ТС] 4
А если форма не имеет кнопки сабмит и она должна закрываться после действия?

HTML5
1
2
3
<form action="" method="post" name="ban">
<a href="javascript: submitform()"><img src="http://www.cyberforum.ru/img/ban-x.png" border="0"></a>
<input type=hidden name="close" value="close">
0
Soldado
731 / 722 / 137
Регистрация: 28.06.2012
Сообщений: 1,318
Записей в блоге: 4
08.11.2012, 15:07 5
Вот здесь есть пример отправки формы с помощью jQuery-Ajax и PHP-код обработчика. Можно также использовать специальный плагин jQuery Form Plugin здесь рабочий пример.
0
Para bellum
Эксперт PHP
4098 / 3048 / 983
Регистрация: 06.01.2011
Сообщений: 8,923
08.11.2012, 15:09 6
Цитата Сообщение от Rock-n-rolla Посмотреть сообщение
А если форма не имеет кнопки сабмит
Тогда ajax-запрос занесите в функцию и выполняйте эту функцию по onclick того элемента, при нажатии на который вы хотите, чтобы форма отправилась.
Цитата Сообщение от Rock-n-rolla Посмотреть сообщение
и она должна закрываться после действия
Тут не понял.
0
Rock-n-rolla
2 / 2 / 0
Регистрация: 02.02.2012
Сообщений: 35
08.11.2012, 15:12  [ТС] 7
<div>форма</div> после нажатия на кнопку у меня исчезает. Обработчик делает так, чтобы форма исчезала. Как это на аяксе реализовать?
0
spyeye
31 / 31 / 2
Регистрация: 06.08.2012
Сообщений: 155
08.11.2012, 15:15 8
Универсальный вариант сабмит, не сабмит, разницы нету:
HTML5
1
2
3
4
5
6
<form method="post">
<input type="text" name="login"><br>
<inpu type="pwd" name="password"><br>
<a href="#" onClick="submit(); return false;">Отправить</a>
</form>
<div id='result'></div>
Javascript
1
2
3
4
5
6
7
function submit(){
var login = $('input[name*="login"]').val();
var pwd = $('input[name*="password"]').val();
$.post('твой обработчик.php', function(data){
$('#result').html(data);
});
}
0
Author_Nick
0 / 0 / 0
Регистрация: 04.01.2015
Сообщений: 1
04.01.2015, 15:59 9
я сделал как ты сказал но всё равно страничка обновляется(
PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
?>
<script>
function submit(){
var msg = $('input[name*="msg"]').val();
$.post('/sections/mail/dialog.php', function(data){
$('#result').html(data);
});
}
</script>
<?php
        //echo "<form action='/mail/dialog/?id=$cont[id]' method='POST' name='message'>\n";
        echo '<form method="post">';
        echo "<input type='text' name='msg' rows='4' style='width:90%'><br />\n";
        //echo "<input class='main_submit' type='submit' value='Отправить' onClick='saveform (this.form);return false;'/> (Ctrl + Enter)\n";
        echo '<input class="main_submit" type="submit" value="Отправить" onClick="submit(); return false;">';
        echo "</form><div id='result'></div>\n";
        echo "</div>\n";
0
04.01.2015, 15:59
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
04.01.2015, 15:59

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

Загрузка без перезагрузки страницы
Всем доброе время суток!!! Есть вопрос как можно на JavaScript написать так...

Выборка <option> без перезагрузки страницы
Здраствуйте! Нужно сделать выборку &lt;option&gt; без перезагрузки страницы, знаю,...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
9
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru