как передать атрибуты по кнопке в форму, с нескольких кнопок

Рейтинг: 0Ответов: 1Опубликовано: 12.07.2023

как передать атрибуты по кнопке в форму, с нескольких кнопок.
заходит только одна кнопка!

всем заранее благодарен!!!!

<div id="order_cancel" class="modal">
    <div class="modal-dialog">
        <div class="modal-content">

            <h3 class="modal-title"></h3>
            
            <form id="form_contact" method="POST" action="" novalidate="novalidate">
                <input type="hidden" name="Id" class="hiddenValue" value="" />
                <input type="hidden" name="_method" value="POST">
            </form>
        </div>
    </div>
</div>

<script>
$(document).ready(function(){
    $('.data_btn').click(function(){
       var data_title  = $('.data_btn').attr('data_title')
       $('.hiddenValue').val(data_title);

       var data_head  = $('.data_btn').attr('data_head')
       $('.modal-title').text(data_head);
       })
})
</script>

<div class="fl">
   <a href="#order_cancel" class="data_btn btn btn_big_violet" 
             data_head="Заголовок в форму111" 
             data_title="название 111"
   >Кнопка</a>
</div>

<div class="fl">
   <a href="#order_cancel" class="data_btn btn btn_big_violet" 
             data_head="Заголовок в форму222" 
             data_title="название 222"
   >Кнопка</a>
</div>
javascript
Источник: Stack Overflow на русском

Ответы

▲ 1Принят

Можете просто поменять $('.data_btn').attr('data_title') и $('.data_btn').attr('data_name') на $(this).attr('data_title') и $(this).attr('data_name') соответственно. Где $(this) это текущий jQuery элемент на который нажал пользователь, то есть одна из Ваших кнопок.

$(document).ready(function() {
  $('.data_btn').click(function() {
    $('.hiddenValue').val($(this).attr('data_title'));
    $('.modal-title').text($(this).attr('data_head'));
  })
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="order_cancel" class="modal">
  <div class="modal-dialog">
    <div class="modal-content">

      <h3 class="modal-title"></h3>

      <form id="form_contact" method="POST" action="" novalidate="novalidate">
        <input type="hidden" name="Id" class="hiddenValue" value="" />
        <input type="hidden" name="_method" value="POST">
      </form>
    </div>
  </div>
</div>

<div class="fl">
  <a href="#order_cancel" class="data_btn btn btn_big_violet" data_head="Заголовок в форму111" data_title="название 111">Кнопка</a>
</div>

<div class="fl">
  <a href="#order_cancel" class="data_btn btn btn_big_violet" data_head="Заголовок в форму222" data_title="название 222">Кнопка</a>
</div>