Форум программистов, компьютерный форум, киберфорум
Наши страницы
jQuery
Войти
Регистрация
Восстановить пароль
 
 
Рейтинг 4.92/13: Рейтинг темы: голосов - 13, средняя оценка - 4.92
Сынок
Заблокирован
1

Ajax + formaction не работает

02.02.2019, 03:21. Просмотров 2350. Ответов 24

Здравствуйте!
HTML5
1
2
3
4
5
6
7
8
<form method="post">
    <input type="hidden" name="id" value="<?= $unit->id_unit ?>">
    <input class="form-control form-control-sm" name="col" autocomplete="off" title="">
    <div class="btn-group btn-block mt-1">
        <button formaction="unit_buy" class="btn btn-sm btn-success" name="do">Купить</button>
        <button formaction="unit_sale" class="btn btn-sm btn-danger" name="do">Продать</button>
    </div>
</form>
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
let button = true;
$(document).on('submit', 'form', function (event) {
    event.preventDefault();
    if (button) {
        button = false;
        let alert = $('#alert').html();
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize() + '&do=' + $(this).find('[name="do"]').val()
        }).done(function (json) {
            json = $.parseJSON(json);
            console.log(json);
            $('button[name="do"]').removeAttr('value');
            $('#alert').html(json.alert).fadeOut(3000, function () {
                $(this).html(alert).show();
                button = true;
                if (json.result === 'success' || json.content === 'exit') {
                    content();
                }
            });
        });
    }
});
Не работает отправка формы по ajax.
Если отключаю js, то нормально попадаю на обработчик и вижу json.
Если поместить один их action в тег form, то тоже тогда работает.
Почему не работает?
Спасибо.
0
Миниатюры
Ajax + formaction не работает   Ajax + formaction не работает  
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
02.02.2019, 03:21
Ответы с готовыми решениями:

не работает ajax из ajax`a
сама функция,которая не работает(ответа не приходит,следовательно не посылается ничего?) function...

Не работает ajax
Не проходит get запрос по клику: var arr = ''; var summ = 0; var num = 0; var given = 0;...

Не работает Ajax
Добрый день. Почему то не работает Ajax, я только начинаю изучать, вот решила простой пример...

Не работает AJAX
начал учить ajax, но че-то не получается вот код: html: &lt;input type=&quot;text&quot; name=&quot;txt&quot; id=&quot;txt&quot;...

Не работает $.ajax()
Скажите, если знаете, почему у меня никак не работает $.ajax? Я уже все перепробовал: все равно...

24
amr-now
Эксперт JS
1558 / 903 / 379
Регистрация: 14.06.2018
Сообщений: 2,280
03.02.2019, 17:33 21
Селектор конечно же кошерно брать так:
Добавлено через 30 минут
Javascript
1
2
3
4
5
6
7
8
                let btn = $('input[type=submit]:focus', this);
                if (!btn.length)
                    btn = $('input[type=submit]', this);
                $.ajax({
                    url: btn.attr("formaction") ? btn.attr("formaction") : this.action,
                    type: this.method,
                    data: $(this).serialize() + '&' + encodeURIComponent(btn.attr('name')) + '=' + encodeURIComponent(btn.val())
                })
0
Сынок
Заблокирован
03.02.2019, 20:20  [ТС] 22
amr-now, интересно, но смущает input, я в button при отправке вставляю так назыемый csrf и потом удаляю value из button

Добавлено через 4 минуты
то есть мне value нужен НЕ для имени кнопки, мне тег button нужен
0
Сынок
Заблокирован
04.02.2019, 10:04  [ТС] 23
Решение:
HTML5
1
2
3
4
5
6
7
8
9
10
11
такая форма
 
<form method="post" id="my">
    <button formaction="handler.php" name="do">Отправить</button>
</form>
 
либо такая форма
 
<form action="handler.php" method="post">
    <button name="do">Отправить</button>
</form>
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
let button = true;
$(document).on('submit', 'form', function (e) {
    e.preventDefault();
    if (button) {
        button = false;
        let alert = $('#alert').html();
        $.ajax({
            url: $(this).attr('id') ? $(document.activeElement).attr('formaction') : this.action,
            type: this.method,
            data: $(this).serialize() + '&do=' + $(this).find('[name="do"]').val()
        }).done(function (json) {
            json = $.parseJSON(json);
            $('button[name="do"]').removeAttr('value');
            $('#alert').html(json.alert).fadeOut(3000, function () {
                $(this).html(alert).show();
                button = true;
                if (json.result === 'success' || json.content === 'exit') {
                    content();
                }
            });
        });
    }
});
0
amr-now
Эксперт JS
1558 / 903 / 379
Регистрация: 14.06.2018
Сообщений: 2,280
04.02.2019, 15:40 24
Сынок, вот здесь грубая ошибка:
Javascript
1
$(this).find('[name="do"]').val()
Будет брать всегда value от первого do. Независимо от наличия других do.

------
Совместными героическими усилиями мы сделали копию штатной отправки формы x-www-form-urlencoded в AJAX:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
                let btn = $('[type=submit]:focus,button:not([type]):focus', this);
                if (!btn.length)
                    btn = $('[type=submit],button:not([type])', this);
                let data = $(this).serialize();
                if (btn.attr('name')) {
                    let append = encodeURIComponent(btn.attr('name')) + '=' + encodeURIComponent(btn.val());
                    if (data) data += '&';
                    data += append;
                }
                $.ajax({
                    url: btn.attr("formaction") ? btn.attr("formaction") : this.action,
                    type: this.method,
                    data: data
                })
Полный макет тестирования с разными формами:
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
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
    <!-- <form method="post">
        <input type="hidden" name="id" value="123">
        <input class="form-control form-control-sm" name="col" autocomplete="off" title="">
        <div class="btn-group btn-block mt-1">
            <button formaction="unit_buy" class="btn btn-sm btn-success" name="do" value="1">Купить</button>
            <button formaction="unit_sale" class="btn btn-sm btn-danger" name="do" value="2">Продать</button>
        </div>
    </form> -->
    <!-- <form method="post">
            <input type="hidden" name="id" value="123">
            <input class="form-control form-control-sm" name="col" autocomplete="off" title="">
            <div class="btn-group btn-block mt-1">
                <input type="submit" formaction="unit_buy" class="btn btn-sm btn-success" name="do" value="Bye" />
                <input type="submit" formaction="unit_sale" class="btn btn-sm btn-danger" name="do" value="Sale" />
            </div>
        </form> -->
    <form method="post" id="my">
        <button formaction="handler1.php" name="do" value="1">Отправить</button>
        <button formaction="handler2.php" name="do" value="2">Отложить</button>
    </form>
    <!-- <form action="handler.php" method="post">
        <button name="do" value="1">Отправить</button>
        <button name="do" value="2">Отложить</button>
    </form> -->
    <div id="alert"><span>Ура!</span></div>
    <script>
        let button = true;
        $('form').on('submit', function (event) {
            event.preventDefault();
            if (button) {
                button = false;
                let alert = $('#alert').html();
                let btn = $('[type=submit]:focus,button:not([type]):focus', this);
                if (!btn.length)
                    btn = $('[type=submit],button:not([type])', this);
                let data = $(this).serialize();
                if (btn.attr('name')) {
                    let append = encodeURIComponent(btn.attr('name')) + '=' + encodeURIComponent(btn.val());
                    if (data) data += '&';
                    data += append;
                }
                $.ajax({
                    url: btn.attr("formaction") ? btn.attr("formaction") : this.action,
                    type: this.method,
                    data: data
                })
                /* Пока не имеет значения
                .done(function (json) {
                    json = $.parseJSON(json);
                    $('button[name="do"]').removeAttr('value');
                    $('#alert').html(json.alert).fadeOut(3000, function () {
                        $(this).html(alert).show();
                        button = true;
                        if (json.result === 'success' || json.content === 'exit') {
                            content();
                        }
                    });
                });
                */
            }
        });
    </script>
</body>
</html>
0
Сынок
Заблокирован
04.02.2019, 16:11  [ТС] 25
Цитата Сообщение от amr-now Посмотреть сообщение
Будет брать всегда value от первого do. Независимо от наличия других do.
всё верно, так и нужно на момент отправки у всех кнопок с name="do" втавляется аттибут value c одинаковым токеном, ошибки нет
0
04.02.2019, 16:11
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
04.02.2019, 16:11

Не работает Ajax в FF
Привет всем. Подскажите, почему не работает ajax запрос в хитром лисе (fire fox)? function...

Не работает ajax
Сначала думал, что просто ошибка в коде, но потом, как написал простейший код:...

Не работает ajax в ie
Помогите пожалуста не работает ajax в ie в файрфоксе в опере всё нормально &lt;?php /* Хост */...


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

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

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