Как в input передать значение data-*?

Question

[Владислав Бойченко]

Всем привет!
Суть вопроса: есть ссылка с атрибутом data-product .
<a href="..." data-product="Номер 1">
И есть форма с текстовым инпутом и кнопкой отправить.

<form>
<input type="text" readonly="readonly">
<input type="submit" value="Отправить">
</form>

Ссылок будет несколько, но с разными значениями атрибута data-product. Как можно по нажатию на ссылку передать значение ее data-* в этот текстовый инпут?

Answer 1

[Максим Тимофеев]

$('a.someclass').on('click',function(){
var mysuperdata = $(this).attr('data-product');
$('input#someuniqid').val(mysuperdata);
alert("ох ты ж епт");
});

Comments

[Владислав Бойченко]

Это оно! Спасибо большое!

[Максим Тимофеев]

Владислав Бойченко: Я старался )))

[Виталий]

вот только клик по ссылке отправит вас на href )))

[Максим Тимофеев]

Виталий: не отправит, алерт вмешается

Answer 2

[lega]

Можно так jsfiddle

Answer 3

[Виталий]

<div class="cont">
  <a href="http://localhost/" data-product="Номер 1">1</a>
  <a href="http://localhost/" data-product="Номер 2">2</a>
  <a href="http://localhost/" data-product="Номер 3">3</a>
</div>
<form>
<input type="text" readonly="readonly">
<input type="submit" value="Отправить">
</form>

document.querySelector('div.cont').addEventListener('click',(event)=>{
  let inputText = document.querySelector('form input[type="text"]');
  inputText.value = event.target.dataset.product;
  event.preventDefault ? event.preventDefault() : (event.returnValue=false);
}, false);

Comments

[Владислав Бойченко]

У меня первый вариант прекрасно работает, но спасибо, что уделили время.

[Виталий]

Владислав Бойченко: не обновлял страницу, не видел jquery кода, да и вдруг кто ищет примеры, как не грузить библиотеку, ради пары функций, которые есть в js

[Владислав Бойченко]

Суть в том, что мне нужно было каталог на 5 товаров сделать без CMS, вот этот вариант и подошел. Можете посмотреть как оно в работе, на одну форму разные данные в поле отправляется. Красиво и удобно) pstroh440.zzz.com.ua/www/index.php

[Виталий]

Владислав Бойченко: чет не понял вашу ссылку, 1 раз нажал заказать, ввел телефон [phone], второй раз заказать выдало модал, который все повесил.

[Владислав Бойченко]

Виталий: форма отправляется только 1 раз, потом перезагружать страницу нужно

[Владислав Бойченко]

Виталий: все, что в каталоге - это 1 форма

[Виталий]

Владислав Бойченко: да да, так и напишите пользователям

[Владислав Бойченко]

Виталий: ну, бюджет заказчика не позволяет мне напрягаться сильнее)