Обработка данных без перезагрузки страницы

@lomvasil · Регистрация: 14.12.2010

Студворк — интернет-сервис помощи студентам

всем привет!

есть страница, которая состоит из 3х блоков:

1. таблица (выводится всегда)
2. кнопка, которая приобретает значение disabled, в случае, если нет определенного куки.
3. форма post, которая появляется, если нет того же куки.

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

PHP
1
echo '<meta http-equiv="refresh" content="0; url=http://...">';

знаю, метод пещерный..

поэтому и ищу способ сделать юзабилити более продвинутым. с Javascript и технологией Ajax не дружу вообще никак. до этого момента все реализовывалось исключительно на php.

многие из Вас наверняка сразу начнут ставить ссылки на api jQuery и т.п., типа читай и просвещайся.

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

иными словами, как сделать так, чтобы после установки куки (проверяются введенные данные в 3м блоке, и, если все ок, - устанавливается куки) не нужно было ставить редирект на перезагрузку страницы, а просто enable кнопку 2го блока и убрать 3й блок, - все это на время, пока есть куки.

заранее спасибо

@djvergon · 07.06.2011, 10:52

бразе да тут тебе ajax нужен вот инфа:
http://anton.shevchuk.name/jav... ners-ajax/
http://zhogov.ru/stat_62.html
http://www.linkexchanger.su/2008/34.html
http://koz1024.net/interfaces/jquery-ajax.html
ещё надо

Добавлено через 4 минуты
а данную задачу без него ни как

@lomvasil · 18.06.2011, 15:32 **[ТС]**

по-моему как-то можно с jQuery ,методом .load()

но почему-то нестыковка где-то:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$('#form_add').submit(function (obj) {
        var name = $('#new_rb_name').val();
        var resp = $('#respawn').val();
        var minus = $('#respawn_minus').val();
        var plus = $('#respawn_plus').val();
        var epique = $('#epique').val();
        var uid = $('#userID').text();
        
        if (name == "" || resp == "*" || minus == "*" || plus == "*" || epique == "эпик?") {
            obj.preventDefault();
            alert('Вы допустили ошибку при вводе. Попробуйте снова.');
        }
        else {
            obj.preventDefault();
            var myAfter = $('#after1, #after2');
            myAfter.after('<option>' + name + '</option>')
            myAfter.load('/service/require_files/without_refresh/add_rb.php', {new_rb_name: name, respawn: resp, respawn_minus: minus, respawn_plus: plus, epique: epique, uid: uid});
        }
        });

.load() обращается к файлу, который должен делать запись в базу:

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
// скрипт добавления в БД только что введенного значения в поля селекта
 
// подключаем функции drupal
define('DRUPAL_ROOT', $_SERVER['DOCUMENT_ROOT']);
require_once DRUPAL_ROOT . '/includes/bootstrap.inc';
drupal_bootstrap(DRUPAL_BOOTSTRAP_FULL);
 
// функция добавления введенных данных в БД
function add_new_rb(){
 
    // делаем проверку на предмет существования такого имени
    $rb_exist = db_query("SELECT raid_name FROM {rb} WHERE uid = :uid", 
                                    array (':uid' => $_POST['uid'])
                            )->fetchCol();
                        
    foreach ($rb_exist as $exist){
        
        if ($exist == $_POST['new_rb_name']){
            return false;
            exit();
        }
    }
    
    if ($rb_exist){    
        
        $insert = db_insert('rb')
                        ->fields(array(
                            'uid' => $_POST['uid'],
                            'raid_name' => $_POST['new_rb_name'],
                            'respawn' => $_POST['respawn'],
                            'respawn_minus' => $_POST['respawn_minus'],
                            'respawn_plus' => $_POST['respawn_plus'],
                            'epique' => $_POST['epique'],))
                        ->execute();
        return true;
    }
}
 
// добавляем данные
add_new_rb($_POST['uid'], $_POST['new_rb_name'], $_POST['respawn'], $_POST['respawn_minus'], $_POST['respawn_plus'], $_POST['epique']);

задача: добавить только что введенные данные дополнительным option в 2 select`а, и произвести запись в БД без перезагрузки страницы.

preventDefault(), чтобы не было отправки формы пост`ом, - выполняется.
var myAfter = $('#after1, #after2'); myAfter.after('<option>' + name + '</option>') - выполняется.

а вот .load(), где должна быть запись в базу не срабатывает. может неверно передаю параметры?

PS чувствую, что делаю фигню, подскажите, как реализовать передачу моих

PHP
1
$_POST['uid'], $_POST['new_rb_name'], $_POST['respawn'], $_POST['respawn_minus'], $_POST['respawn_plus'], $_POST['epique']

без перезагрузки страницы. смотрю в книгу, - вижу...

@romchiksoad · 19.06.2011, 12:03

Комментарий модератора

djvergon, старайтесь указывать ссылки на официальные источники.

lomvasil, Вы, наверно, не знаете, что jQuery это всего лишь библиотека написанная на том же JavaScript и в нее уже включен тот самый Ajax. Просто для работы с ним используется синтаксис jQuery.

@lomvasil · 19.06.2011, 15:02 **[ТС]**

пробовал уже

JavaScript
1
2
3
4
5
6
7
$.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success
  dataType: dataType
});

не могу найти примеров и описания возможности передачи нескольких переменных в php скрипт

@romchiksoad · 19.06.2011, 16:44

lomvasil, это потому, что Вы не знаете как это реализуется на чистом JavaScript и Ajax. Так же было бы не плохо знать устройство HTTP-протокола и его методов передачи данных на сервер.
Т.к. я никогда не использовал jQuery, могу только предполагать, что в четвертой строке Вашего кода нужно передавать данные, которые отправляются на сервер. Если так, то тогда:

JavaScript
1
2
3
4
5
6
7
$.ajax({
  type: 'POST',
  url: url,
  data: 'FirstName=Vasia&LastName=Pupkin',
  success: success
  dataType: dataType
});

На сервере в супер глобальный массив $_POST[] попадут два элемента:

PHP
1
$_POST['FirstName'] && $_POST['LastName'];

@lomvasil · 19.06.2011, 17:22 **[ТС]**

да, уже сделал, спасибо, синтаксис такой:

JavaScript
1
2
3
4
5
6
7
8
9
$.ajax({url: "/service/require_files/ajax/add_rb.php",
        type: 'POST',
        data: {new_rb_name : name, 
               respawn : resp, 
               respawn_minus : minus, 
               respawn_plus : plus, 
               epique : epique, 
               uid : uid}
       });

все работает

Новые блоги и статьи Все статьи Все блоги /
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .

@djvergon наблюдатель 28 / 17 / 5 Регистрация: 20.05.2011 Сообщений: 1,123
	07.06.2011, 10:52
	бразе да тут тебе ajax нужен вот инфа: http://anton.shevchuk.name/jav... ners-ajax/ http://zhogov.ru/stat_62.html http://www.linkexchanger.su/2008/34.html http://koz1024.net/interfaces/jquery-ajax.html ещё надо Добавлено через 4 минуты а данную задачу без него ни как 1