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

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

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

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

Помогут разобраться в теме Все курсы

Нетология

Fullstack-разработчик на Python + нейросети

20 месяцев

Далее
Skillfactory

Профессия Веб-разработчик

12 месяцев

Далее
Академия Eduson

Fullstack-разработчик на JavaScript

11 месяцев

Далее

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

Ответы на вопрос 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 ещё

Сложный
Почему зависает виджет в OBS?
- 1 подписчик
- 19 часов назад
- 108 просмотров
0

ответов
JavaScript

Простой
Смещение группы в fabric.js?
- 1 подписчик
- 06 нояб.
- 99 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Как сделать горизонтальный скролл стрелками?
- 1 подписчик
- 05 нояб.
- 147 просмотров
0

ответов
JavaScript

Простой
Как создать рисунок из PHP в Fabric.js?
- 2 подписчика
- 28 окт.
- 154 просмотра
1

ответ
JavaScript

+1 ещё

Простой
Какой скрипт загружает меню в Ютуб?
- 2 подписчика
- 27 окт.
- 275 просмотров
2

ответа
JavaScript

Простой
Как работать с разрозненными данными?
- 1 подписчик
- 21 окт.
- 246 просмотров
2

ответа
JavaScript

+1 ещё

Простой
Неправильно работает crypto.subtle.deriveKey в Firefox, баг или мой косяк?
- 2 подписчика
- 16 окт.
- 150 просмотров
0

ответов
JavaScript

Простой
Как подгружать xml с перерисовкой таблицы?
- 3 подписчика
- 14 окт.
- 192 просмотра
0

ответов
JavaScript

+2 ещё

Простой
Как решить задачку из контеста?
- 1 подписчик
- 13 окт.
- 268 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Есть ли js-библиотека для офлайн-распознавания русской речи?
- 1 подписчик
- 12 окт.
- 189 просмотров
2

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

Fullstack Разработчик (Next.js / JavaScript / TypeScript)

App Company

от 200 000 до 300 000 ₽

Web-разработчик/WordPress программист (Full-stack)

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

от 130 000 до 150 000 ₽

React разработчик

ITK academy • Нижний Новгород

от 50 000 до 90 000 ₽

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

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

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

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