У меня на странице есть две 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

+1 ещё

Простой
Почему реакт странно рисует остальные элементы массива?
- 1 подписчик
- 2 часа назад
- 35 просмотров
0

ответов
JavaScript

+3 ещё

Простой
Как настроить цели в Яндекс аналитике для телеграм-бота (написан на пайтоне)?
- 1 подписчик
- 5 часов назад
- 28 просмотров
0

ответов
JavaScript

Простой
Как улучшить данный скрипт?
- 1 подписчик
- 7 часов назад
- 48 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Как сделать подобную анимацию в JavaScript?
- 2 подписчика
- 7 часов назад
- 202 просмотра
2

ответа
JavaScript

+2 ещё

Простой
Резкость карусели swiper, почему так происходит?
- 1 подписчик
- 7 часов назад
- 37 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Как сделать отложенную инициализацию инстанса axios?
- 1 подписчик
- 8 часов назад
- 24 просмотра
1

ответ
JavaScript

+2 ещё

Простой
Как заполнять поля на html-странице из функции на php?
- 1 подписчик
- 11 часов назад
- 89 просмотров
2

ответа
JavaScript

Простой
Как понять что скрипт перестал работать после того как развернули браузер?
- 1 подписчик
- 13 часов назад
- 65 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Как воспроизводить звук в PWA приложениях?
- 1 подписчик
- 13 часов назад
- 72 просмотра
1

ответ
JavaScript

+1 ещё

Средний
Как правильно сделать переключение темы?
- 1 подписчик
- 17 часов назад
- 97 просмотров
2

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

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

Rocket • Смоленск

от 80 000 до 130 000 ₽

JavaScript Developer

AppsTrain.io

от 80 000 до 180 000 ₽

JavaScript FullStack developer

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

До 220 000 ₽

Оптимизация ботов телеграм

06 нояб. 2024, в 00:20

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

Смарт-контракт на блокчейне TON

06 нояб. 2024, в 00:03

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

Ручное тестирование приложения в сторах (iOS и Android)

05 нояб. 2024, в 23:19

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

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 файл?

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

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

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