Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.12.2022, 11:45
Новичок на форуме
Отправить личное сообщение для R.Titovich Посмотреть профиль Найти все сообщения от R.Titovich
 
Регистрация: 30.03.2020
Сообщений: 5

Получение значения из button и передача в JS
Здравствуйте! Столкнулся с такой проблемой в написании скрипта.
Имеется таблица где крайняя колонка - кнопка button, куда я в data-id присваиваю id записи и по нажатию открываю модальное окно bootstrap.
Вопрос заключается в следующем, как мне вывести data-id в поле input модального окна?
Я использую:
$(document).on("click", ".btn", function () {
 var myBookId = $(this).data('id');
 document.getElementsByName('numid')[0].value=myBookId;
});

Но в результате получаю "undefined".
Ответить с цитированием
  #2 (permalink)  
Старый 08.12.2022, 12:09
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

R.Titovich,
сделайте минимальный пример, кнопка и модальный блок
Ответить с цитированием
  #3 (permalink)  
Старый 08.12.2022, 12:35
Новичок на форуме
Отправить личное сообщение для R.Titovich Посмотреть профиль Найти все сообщения от R.Titovich
 
Регистрация: 30.03.2020
Сообщений: 5

Сообщение от рони Посмотреть сообщение
R.Titovich,
сделайте минимальный пример, кнопка и модальный блок
На первом скриншоте таблица. по кнопке "Решена" или "Открыта" вызывается модальное окно. У этой же кнопки data-id = номеру из 2 колонки. Мне нужно данный data-id вывести в input модального окна.
Изображения:
Тип файла: jpg 1й.jpg (56.1 Кб, 4 просмотров)
Ответить с цитированием
  #4 (permalink)  
Старый 08.12.2022, 12:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от рони
сделайте минимальный пример, кнопка и модальный блок
Ответить с цитированием
  #5 (permalink)  
Старый 08.12.2022, 12:54
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

R.Titovich,
html кнопки и поле ввода.
Ответить с цитированием
  #6 (permalink)  
Старый 08.12.2022, 13:03
Новичок на форуме
Отправить личное сообщение для R.Titovich Посмотреть профиль Найти все сообщения от R.Titovich
 
Регистрация: 30.03.2020
Сообщений: 5

Сообщение от рони Посмотреть сообщение
R.Titovich,
html кнопки и поле ввода.
<button type="button" class="btn btn-block btn-danger btn-xs" data-toggle="modal" data-target="#modal-typeiss" data-id="'.$itm3['id'].'">Открыта</button>


<input type="text" name="numid" id="idissues" class="form-control" required hidden>
Ответить с цитированием
  #7 (permalink)  
Старый 08.12.2022, 13:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

R.Titovich,
<!DOCTYPE html>
<html>

<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/js/bootstrap.js"></script>
    <script>
        $(function() {
            $('#modal-typeiss').on('shown.bs.modal', function(event) {
                let btn = event.relatedTarget;
                let id = $(btn).data('id');
                $('[name="numid"]', this).val(id);
            })
        });
    </script>
</head>

<body>
    <button type="button" class="btn btn-block btn-danger btn-xs" data-toggle="modal" data-target="#modal-typeiss" data-id="'.$itm3['id'].'">Открыта</button>
    <!-- Modal -->
    <div class="modal fade" id="modal-typeiss" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                </div>
                <div class="modal-body">
                    <input type="text" name="numid" id="idissues" class="form-control" required>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </div>
    </div>
</body>

</html>
Ответить с цитированием
  #8 (permalink)  
Старый 08.12.2022, 14:13
Новичок на форуме
Отправить личное сообщение для R.Titovich Посмотреть профиль Найти все сообщения от R.Titovich
 
Регистрация: 30.03.2020
Сообщений: 5

рони, благодарю! Все работает как задумано!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Получение месяца в JS TechnicalMan94 Общие вопросы Javascript 6 04.01.2019 21:26
Передача значения внутри тега <label> на сервер при помощи AJAX MaksimZykov AJAX и COMET 4 22.10.2018 09:51
передача значений перемнных из js в html Vladtru Общие вопросы Javascript 1 15.10.2018 09:01
Получение и вывод псевдоэлементов через js madeas Элементы интерфейса 2 23.07.2018 17:49
Вывод JS значения в одну строку в HTML velo Общие вопросы Javascript 7 15.12.2009 03:57