Ajax обработка запроса

@wredyatina · Регистрация: 06.09.2011

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

Здравствуйте, у меня проблемы с ajax не понимаю я их видимо(( что не пишу, все не работает...
Начну с маленькой задачи:
Корзина. В сессии записывается количество и id товара. С выводом все хорошо.
вырвала нужные нам куски кода

HTML5
1
2
3
4
5
<form method="post" action="">
    <input type="hidden" name="session_n" id="session_n" value="<?=$x?>">
    <input type="text" name="count1" id="count1" value="<?=$_SESSION['basket'][$x][1]?>" >
    <input type="submit" name="delete_bk"  id="delete_bk" value="удалить" /></td>
    </form>

PHP
1
2
3
4
if (isset($_REQUEST['delete_bk'])){
     $session_n = $_POST['session_n'];
         
         unset($_SESSION['basket'][$session_n]); }

Удаляю, но страница обновляется, хочется без обновления.
Делаю так

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$(document).ready(function(){  
          
            $('#delete_bk').click(function(){  
                $.ajax({  
                    url: "basket_delete_n.php",  
                    data: "session_n="+$("#session_n").val(),
                    success: function(data){  
                        if ( data.error )
                        {
                        alert( data.error );
                        return false;
                        }
                        alert( "Прибыли данные: " + data );  
                    }  
                });    
            });  
                
        });

basket_delete_n.php

PHP
1
2
3
4
5
$session_n = $_POST['session_n'];
 
unset($_SESSION['basket'][$session_n]);
 
echo 'Успешно удалена строка №'.$session_n.'';

// ИЛИ вот так тоже пробовала

PHP
1
2
3
4
5
6
7
8
9
10
11
if (isset($_SESSION['user_id'])) { 
 
if (isset($_REQUEST['session_n'])){
     $session_n = $_REQUEST['session_n'];
    
unset($_SESSION['basket'][$session_n]);
 
echo 'Успешно удалена строка №'.$session_n.'';
} else {echo 'Запись №'.$session_n.' не удалена';}
 
}

Добавлено через 22 минуты
Да забыла: в alert ругается, что индекс не определен, т.е. не доходит до него $session_n

Добавлено через 7 минут
Хм... вроде бы ничего не меняла, сейчас ошибку не дает, вылезает alert ("Данные удалены"),
но строка по прежнему на месте((

Добавлено через 33 секунды
Ребята ну подскажите пожалуйста, что я не так принимаю или вывожу данные?
Ну очень надо разобраться..
Я пробовала без данных без поля data все работает, просто файл подгружается и выполняет действия.
А уже с данными ничего(( Уже обчиталась всего, а ошибку найти не могу...

artnazarov · 01.08.2014, 17:36

type="submit" не настораживает?

@fanatikus · 01.08.2014, 17:37

Удаляю, но страница обновляется, хочется без обновления.

чтобы страница не перезагружалась нужно

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
 $('#delete_bk').click(function(){  
                $.ajax({  
                    url: "basket_delete_n.php",  
                    data: "session_n="+$("#session_n").val(),
                    success: function(data){  
                        if ( data.error )
                        {
                        alert( data.error );
                        return false;
                        }
                        alert( "Прибыли данные: " + data );  
                    }  
                });  return false;  //чтобы не перезагружалась
            });

что касается индекс не определен , так откуда берется error (data.error)
в data у вас то, что вернул сервер, а от вернул строку

PHP
1
echo 'Успешно удалена строка №'.$session_n.'';

@wredyatina · 01.08.2014, 22:37 **[ТС]**

Сообщение от artnazarov

type="submit" не настораживает?

Поменяла ничего не изменилось.

Сообщение от fanatikus

что касается индекс не определен , так откуда берется error (data.error)
в data у вас то, что вернул сервер, а от вернул строку

Так он не возвращает, я получаю только: "Прибыли данные:"

Выводит нр. 5 позиций, alert появляется только при нажатии на первую позицию.

Добавлено через 3 минуты
При этом все равно действие не выполняется.

Добавлено через 5 минут
если делать без данных, удаление всего массива, а не одной позиции все работает, действие выполняется

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$('#delete_bk_all').click(function(){   
        $.ajax({
            url: "basket_delete_all.php",
            success: function(data){
                 if ( data.error )
                        {   alert( data.error );
                            return false;
                            }
                alert( "Прибыли данные: " + data );
                }
                });return false;
            });

добавила return false; все сработало без обновления. Только вот о том, что данных нет в таблице, я увидела перезагрузив сама страницу.
А как сделать чтобы данные и в таблице менялись? После выполнения действий без обновлений?
Или пусть обновляется, зря цепляюсь?

Добавлено через 45 минут
В общем попробовала на другом примере:
в data добавляла две позиции data: "count="+count&"id_prod="+id_prod, не сработало как всегда, добавила всю форму

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$("#my1").submit(function() {   
        // var count = $("#count").val();
        // var id_prod = $("#id_prod").val();
                $.ajax({  
                    url: "basket2.php",  
                    data: $('#my1').serialize(),
                    success: function(data){  
                        if ( data.error )
                        {
                            alert( data.error );
                            return false;
                            }
                            alert( "Данные добавлены");  
                    }  
                }); return false; 
            });

добавляет данные и выполняет функции, но почему-то обновляет... return false; стоит...
добавляет и alert выводит только с первой позиции.

Добавлено через 18 минут
Тоже самое пробовала для удаления позиции и не работает. Кошмар какой-то..

Добавлено через 22 минуты
В общем в basket_delete_n.php

PHP
1
2
3
4
5
$session_n = $_REQUEST['session_n']; // поменяла с POST
 
unset($_SESSION['basket'][$session_n]);
 
echo 'Успешно удалена строка №'.$session_n.'';

Ура ура, одну строку удаляет... только вот ПЕРВУЮ

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

Добавлено через 12 минут
Я думаю перестанет обновляться, если действия скрипта распространиться, на все строки, а не на первую.

@fanatikus · 02.08.2014, 00:02

А как сделать чтобы данные и в таблице менялись?

с помощью js удалять или добавлять новые данные

@Dolphin · 02.08.2014, 05:55

Нужно вешать на событие формы onsubmit, иначе не перехватить форму

@wredyatina · 02.08.2014, 08:43 **[ТС]**

Сообщение от Dolphin

Нужно вешать на событие формы onsubmit, иначе не перехватить форму

у меня структура получается:

HTML5
1
2
3
4
5
<table>
<form><tr>
<!-- Информация об одной позиции товара, input[submit] из формы для удаления позиций-->
</tr></form>
</table>

И onsubmit к таблице не применить((
а как-то по другому можно? или у меня логика вывода не правильная?

Ув. форумчане, как же мне сделать чтобы функции выполнялись для всех строк, а не для одной?

@fanatikus · 02.08.2014, 17:23

в общих чертах, как-то так
файл cat.php

PHP/HTML
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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
<?php session_start()?><!DOCTYPE HTML>
 
<head>
    <meta charset="utf-8" />
    <title>INDEX</title>
    <script type="text/javascript" language="javascript" src="jquery-1.9.1.js"></script>
    <script type="text/javascript" language="javascript"></script>
</head>
<body>
    <p id="mes" style="display: none"></p>
    <table border="1">
         <thead>
            <tr>
                <th>наименование</th>
                <th>количество</th>
                <th>цена</th>
                <th>сумма</th>
                <th>опции</th>
            </tr>
         </thead>
         <tbody>
             <?php $sum = 0; ?>
             <?foreach($_SESSION['products'] as $k => $v):?>
                 <tr id="<?=$k?>">
                    <td><?=$v['name']?></td>
                    <td><input type="text" class="count" value="<?=$v['count']?>"/></td>
                    <td><?=$v['prise']?></td>
                    <td id="sum-<?=$k?>"><?=$v['count']*$v['prise']?></td>
                    <td><button type="button" for="<?=$k?>" class="but">Удалить</button></td>
                </tr>
                <?php $sum += $v['count']*$v['prise']; ?>
             <?endforeach?>
            
         </tbody>
    </table>
    <p>Всего - <strong id="res"><?=$sum?></strong></p>
<script type="text/javascript">
    $(document).ready(function(){
        $('.count').change(function(){
            var count = $(this).val();
            var prise = $(this).parent().next().html();
            var sum = count * prise;
            var id = $(this).parent().parent().attr('id');
            var s = $('#sum-'+id).text();
            var res = $('#res').text();
            $('#res').text(res - s +sum);
            $('#sum-'+id).text(sum);
 
            
        });
        $('.but').click(function(){
            var id = $(this).parent().parent().attr('id');
            $.ajax({
                type:'post',
                url: 'ind.php',
                data: 'id='+id,
                success:function(mes){
                    if(mes == '1'){
                      var  m = 'Данные о товаре удалены';
                    }
                    else{
                        var m = 'Данные о товаре удалить не удалось';
                    }
                    var sum = $('#sum-'+id).text();
                    var res = $('#res').text();
                    var resSum = res - sum;
                    
                    $('#mes').html(m);
                    $('#mes').show();
                    $('#'+id).remove();
                    
                    $('#res').text(resSum);
                }
            })
            
        });
    })
</script>
 
</body>
</html>
<?php 
if(empty($_SESSION['products'])){
    $_SESSION['products'][1]['name']= 'Товар1';
    $_SESSION['products'][1]['prise'] = 100;
    $_SESSION['products'][1]['count'] = 1;
    $_SESSION['products'][2]['name']= 'Товар2';
    $_SESSION['products'][2]['prise'] = 200;
    $_SESSION['products'][2]['count'] = 1;
    $_SESSION['products'][3]['name']= 'Товар3';
    $_SESSION['products'][3]['prise'] = 300;
    $_SESSION['products'][3]['count'] = 1;
    $_SESSION['count'] = count($_SESSION['products']);
}
 
?>

и файл ind.php

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
<?php session_start();
if(isset($_POST['id'])){
    $id = $_POST['id'];
    unset($_SESSION['products'][$id]);
if(!isset($_SESSION['products'][$id])){
        echo '1';
    }
    else{
        echo '0';
    }
}

@wredyatina · 02.08.2014, 21:04 **[ТС]**

fanatikus СПАСИБО ОГРОМНОЕ!!!!
Все оказывается просто, я заморачивалась почем зря((

Добавлено через 18 минут
Еще вопрос, не обновляются данные таблицы при удалении товара, только после обновления.

Добавлено через 6 минут
Косяк нашла..

PHP
1
2
3
4
5
6
$count_n = count ($_SESSION['basket']);
$n=0; while ($n<$count_n){  //тут косяк
?>
<?=$n++?> <!-- порядковый номер в таблице -->
<? // вывод всех данных
}

Если $n=0, все поля данных выводит, но порядковый номер начинается с 0
Если $n=1, пропадает одна первая позиция, порядковый номер начинается с 1
Почему так? Почему пропадает? и как сделать чтобы выводилось все правильно?

@fanatikus · 02.08.2014, 23:14

а если так

PHP
1
$n=1; while ($n<=$count_n)

@wredyatina · 03.08.2014, 01:14 **[ТС]**

Сообщение от wredyatina

Если $n=1, пропадает одна первая позиция, порядковый номер начинается с 1

писала)

Добавлено через 2 минуты
Позицию 1 становиться видно, только после добавления еще одной, т.е. чтобы видеть все товары, надо чтобы товаров в корзине было больше 2, это очень неудобно((
я перепроверила несколько раз ошибку дает именно изменение $n, остальные не влияют.. очень странно, всегда пользуюсь и все нормально обычно

Добавлено через 12 минут
у меня еще вопрос

:

сейчас происходит удаление позиций, но видно только после обновления страницы. Как сделать чтобы таблица с содержимым обновлялась, после выполнения функции удаления. В инете смотрела вроде можно с применением load, да у меня не работает((

HTML5
1
2
3
<div id="shop">
<!-- Вся моя корзина-->
</div>

JavaScript
1
$("#shop").load("page.php #shop");

Добавлено через 20 минут
Есть же функция на перезагрузку страницы location.reload();

@fanatikus · 03.08.2014, 12:00

Есть же функция на перезагрузку страницы location.reload();

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

JavaScript
1
2
3
4
 $('#mes').html(m); //добавляем сообшение
 $('#mes').show();// выводим контейнер с сообщением
 $('#'+id).remove(); // удаляем строку с удаленным товаром
 $('#res').text(resSum); //обновляем общую сумму

@wredyatina · 03.08.2014, 19:55 **[ТС]**

Блин да я ошиблась, не внимательно сделала, все с желанием быстрее быстрее чтобы работало...
я немножко переделывала скрипт, вот id не поменяла(( глупо.

Только у меня он не пересчитывает общую сумму, да и количество строк, видимо тоже ошибка, сейчас буду смотреть)

Добавлено через 1 час 32 минуты
все исправила, работает подсчет общей суммы)

Добавлено через 29 минут
Ну и напоследок еще вопросик задам)
У меня на input закреплен плюс-минус

HTML5
1
2
3
4
5
6
7
<td>
<div style=" margin-top:5px; margin-bottom:-5px;"><div id="number">
    <span class="minus">-</span>
    <input type="text" class="count" value="<?=$v['count']?>"/>
    <span class="plus">+</span>
</div></div>
</td>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
        $(document).ready(function() {
            $('.minus').click(function (e) {
                e.preventDefault();
                var $input = $(this).parent().find('input');
                var count = parseFloat($input.val()) - 1;
                count = count < 1 ? 1 : count;
                $input.val(count);
            });
            $('.plus').click(function (e) {
                e.preventDefault();
                var $input = $(this).parent().find('input');
                $input.val(parseFloat($input.val()) + 1);
            });
        });

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

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 var $input = $(this).parent().find('input');
                var count = parseInt($input.val()) - 1;
                count = count < 1 ? 1 : count; // как я понимаю вот он новый
                $input.val(count);
                $input.change();
                return false;
 
                // и сделать нашу функцию
                var prise = $(this).parent().next().html();
                var sum = count * prise;
                var id = $(this).parent().parent().attr('id');
                var s = $('#sum-'+id).text();
                var res = $('#res').text();
                $('#res').text(res - s +sum);
                $('#sum-'+id).text(sum);

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++ 8Observer8 10.03.2026 Содержание блога Финальные проекты на Си и на C++: hello-sdl3-c. zip hello-sdl3-cpp. zip Результат:	Установка CMake и MinGW 13.1 для сборки С и C++ приложений из консоли и из Qt Creator в EXE 8Observer8 10.03.2026 Содержание блога MinGW - это коллекция инструментов для сборки приложений в EXE. CMake - это система сборки приложений. Здесь описаны базовые шаги для старта программирования с помощью CMake и. . .	Как дизайн сайта влияет на конверсию: 7 решений, которые реально повышают заявки Neotwalker 08.03.2026 Многие до сих пор воспринимают дизайн сайта как “красивую оболочку”. На практике всё иначе: дизайн напрямую влияет на то, оставит человек заявку или уйдёт через несколько секунд. Даже если у вас. . .	Модульная разработка через nuget packages DevAlt 07.03.2026 Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .
Модульный подход на примере F# DevAlt 06.03.2026 В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .	Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование 8Observer8 05.03.2026 Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .	SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D 8Observer8 04.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .	SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий 8Observer8 02.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip Сканируйте QR-код на мобильном и вы увидите, что появится джойстик для управления главным героем. . . .

artnazarov 15 / 15 / 8 Регистрация: 29.07.2014 Сообщений: 120
	01.08.2014, 17:36
	type="submit" не настораживает? 0

@Dolphin 814 / 797 / 201 Регистрация: 21.09.2012 Сообщений: 2,656
	02.08.2014, 05:55
	Нужно вешать на событие формы onsubmit, иначе не перехватить форму 0