У меня на странице есть две ajax jquery функции по клику. Как перенести эти функции в отдельный js файл?

Question

bpGusar @bpGusar

*spoiler*

JavaScript

У меня на странице есть две ajax jquery функции по клику. Как перенести эти функции в отдельный js файл?

У меня на странице есть две ajax jquery функции по клику.

$(document).on('click', '#editBtnModal', function (e) {
            var id_games = $(this).val();
            $.ajax({
бла бла бла

и

$(document).on('click', '#saveBtnInModal', function (e) {
            var formData = new FormData($("#editFormModal")[0]);
            $.ajax({
бла бла бла

как их перенести в отдельный js файл и вызывать по клику на кнопку, при этом передавать value кнопки с id '#editBtnModal' ?

Вопрос задан более трёх лет назад
297 просмотров

1 комментарий

Подписаться 2 Оценить 1 комментарий

Пригласить эксперта

Ответы на вопрос 1

14 комментариев

bpGusar @bpGusar Автор вопроса

а как лучше сделать?

Написано более трёх лет назад
Кирюшка Цисарь @carlcox

Я даже вашего вопроса не понял:) по правьте его конкретнее что именно не поулчается

Написано более трёх лет назад
bpGusar @bpGusar Автор вопроса

value Не передается почему то

Написано более трёх лет назад
bpGusar @bpGusar Автор вопроса

Кирюшка Цисарь, может так понятнее будет

Написано более трёх лет назад

Кирюшка Цисарь @carlcox

<html>
<body>
<div>
 <a href="" class="btn" data-value="1"></a>
 <a href="" class="btn" data-value="2"></a>
 <a href="" class="btn" data-value="3"></a>
 <a href="" class="btn" data-value="4"></a>
 <a href="" class="btn" data-value="5"></a>
</div>
<script src="./script.js"></script>
</body>
</html>

script.js

$('.btn').click(function(){
var value =  $(this).data('value')
})

Написано более трёх лет назад

bpGusar @bpGusar Автор вопроса

Кирюшка Цисарь, не выполняется ajax ((

Написано более трёх лет назад
Кирюшка Цисарь @carlcox

console.log(value)
сделайте и посмотрите в консоли выводится value или нет, в чем ошибка в ajax или в самом клике

Написано более трёх лет назад
bpGusar @bpGusar Автор вопроса

Кирюшка Цисарь,
var id_games = $(this).data('value');
console.log(id_games);

лог
undefined

Написано более трёх лет назад
bpGusar @bpGusar Автор вопроса

Кирюшка Цисарь, поправка, в лог ответ приходит в нормальном виде, то есть data-value передает, но вот в ajax не идет

Написано более трёх лет назад
Кирюшка Цисарь @carlcox

стоп, у где значение?) в инпуте?

тогда var id_games = $(this).val()

Написано более трёх лет назад
Кирюшка Цисарь @carlcox

в ajax не может не идти может дальше не проходит или не правильно получаете, код побольше, не понятно где именно у вас проблема, научитесь искать ошибки сами -> смотрите вкладку "Сеть" в разработчике при отправке ajax

Написано более трёх лет назад

bpGusar @bpGusar Автор вопроса

Кирюшка Цисарь,

$(document).ready(function () {
        $('.editBtnModal').click(function(e){
            var id_games =  $(this).data('value');
            console.log(id_games);
        $.ajax({
            type: 'GET',
            url: "{{ route('getGameInfo') }}",
            data: {id_games: id_games},
            beforeSend: function () {
                // до отправки данных, можно поставить например гифку loading
                swal.enableLoading();
            },
            success: function (data) {
                // удача
                var editFormModal = $('#editFormModal');
                editFormModal.find('#id_games').val(data.id_games);
                editFormModal.find('#game_name').val(data.game_name);
                editFormModal.find('#game_desc').val(data.game_desc);
                editFormModal.find('#steam_link').val(data.steam_link);
                editFormModal.find('#id_developer').val(data.id_developer);
                swal.close();
                $('.modal').modal('show')

            },
            error: function (data) {
                // если ошибка, показываем ошибку
                swal({
                    title: 'Ошибка! Что-то не так!',
                    type: 'error',
                    timer: 10000
                }).then(
                    function () {
                    },
                    // handling the promise rejection
                    function (dismiss) {
                        if (dismiss === 'timer') {
                        }
                    }
                );
            },

            complete: function () {
                // после завершения запроса, с любым исходом. Убираем гифку загрузки
            },
        });
        $('#exampleModalLabel').text('Редактировать');
        $('#saveBtnInModal').show();
        $('#addNewGameBtnInModal').hide();
        $('#editFormModal').show();
        $('#formAddNewGame').hide();
        e.preventDefault();
    });

    $('.addBtnModal').click(function (event) {
        $('#exampleModalLabel').text('Добавить новую игру');
        $('#addNewGameBtnInModal').show();
        $('#saveBtnInModal').hide();
        $('#formAddNewGame').show();
        $('#editFormModal').hide();
    });
});

<button type="button" data-value="34" class="btn btn-primary editBtnModal">Редактировать</button>

Написано более трёх лет назад

bpGusar @bpGusar Автор вопроса

Кирюшка Цисарь, я разобрался крч. тупанул со всей силы епт. но всё равно спасибо.

Написано более трёх лет назад
Кирюшка Цисарь @carlcox

Павел Бондаренко, незашт)

Написано более трёх лет назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы

JavaScript

+2 ещё

Простой
Где можно увидеть реализацию такого эффекта при скролле?
- 1 подписчик
- 15 часов назад
- 96 просмотров
2

ответа
JavaScript

Простой
Fetch дает ошибку?
- 1 подписчик
- 20 часов назад
- 92 просмотра
1

ответ
JavaScript

Простой
Обьясните про функцию массив?
- 3 подписчика
- вчера
- 600 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Почему JS не видит SVG-элементы по ID?
- 1 подписчик
- 22 нояб.
- 70 просмотров
1

ответ
JavaScript

Средний
Почему не срабатывает горячая клавиша в расширение?
- 1 подписчик
- 22 нояб.
- 40 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Почему react-hook-form не отображает ошибки zod в определенных моментах?
- 1 подписчик
- 22 нояб.
- 34 просмотра
0

ответов
JavaScript

Простой
Почему перестало работать меню?
- 1 подписчик
- 20 нояб.
- 148 просмотров
1

ответ
JavaScript

Простой
Какая логика у перебора массива таким способом?
- 1 подписчик
- 20 нояб.
- 187 просмотров
5

ответов
JavaScript

+1 ещё

Простой
Как перевести перевести top в translateY?
- 1 подписчик
- 20 нояб.
- 86 просмотров
1

ответ
JavaScript

Простой
E.target видит лишь малую область блока?
- 1 подписчик
- 20 нояб.
- 58 просмотров
1

ответ
Показать ещё Загружается…

JavaScript FullStack разработчик

Rocket • Смоленск

от 80 000 до 130 000 ₽

Fullstack разработчик JavaScript, php

Дорстрой-36 • Воронеж

от 100 000 до 200 000 ₽

JavaScript FullStack developer

Wanted. • Санкт-Петербург

До 220 000 ₽

Написать запросный бот парсер поиска с функцией автоматической записи

24 нояб. 2024, в 15:21

120000 руб./за проект

Дизайн интерфейса веб-приложения

24 нояб. 2024, в 14:37

3000 руб./в час

Обновить дизайн карты метро Москвы

24 нояб. 2024, в 13:04

500 руб./в час

Answer 1 · 2017-09-04 15:43:48

Они выполняются когда кликают на кнопку с таким то id="", кнопок с одинаковым id много

- это плохо! id - должен быть уникален для того он и существует, class - для одинаковых атрибутов
и вопрос не корректный какой-то, берёте и переносите, как это у вас не получилось?
index.html

<html>
....
<script src="./script.js"></script>
</html>

script.js

У меня на странице есть две ajax jquery функции по клику. Как перенести эти функции в отдельный js файл?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт