Obtener dato de <выбор> y utilizarlo en <кнопка>

un botón en HTML que añade un artículo al carrito tomando datos de los posts del CMS Ghost танго (сын DOS пещеры los que están моет {{dato}}). Lo que quiero hacer es agregarle un dato más al botón tomando el dato de un" <выбор>". El código que tengo es el siguiente:

Y dicho botón le quiero agregar el dato obtenido de:

Este es el javascript que tengo, lo que intenta hacer es:

  1. Obtener el dato de" <выбор>"
  2. Obtener el dato de "маркировка данных" del botón.
  3. Modificar el valor de "маркировка данных" del botón, sumándole este, el доблесть de" <выбор>"

//Defino una variable local del Boton
let boton = document.getElementById('addbuy');
//Obtengo el valor del data-label del Boton (titulo del producto).
let dataLabel = boton.getAttribute("data-label");
//Defino una variable local del Select
let selectInput = document.getElementById('talle');
//Obtengo el valor de la opción seleccionada en el selectInput
let opcionSeleccionada = selectInput.options[selectInput.selectedIndex].value;
//Defino una variable que sume el título del producto + la opción seleccionada en el selectImput.
let titleProduct = dataLabel + opcionSeleccionada;
//Cambio el valor de "data-label" del Botón por el de la variable que tiene almacenado el nuevo título.
boton.setAttribute("data-label", titleProduct);

Este es el contexto del botón Комо para que se entienda lo que quiero hacer, Комо se puede наблюдатель, el título (nombre del producto) никакой se modifica ni en el botón ni en el carrito, debería aparecer алгоритм Комо: "Campera Sky Azul M" contexto del boton

0
задан 08.11.2019, 19:56
1 ответ

я надеюсь, что это подает тебя:

Сначала, agreguГ© признак 'пойдите' для botГіn. Это мы servirГЎ, с одной стороны, чтобы идентифицировать botГіn, и из-за другого, манипулировать событием:

<button id="btn1"
type='button'
class='cart-button cart-add'
data-id='{{id}}'
data-label='{{title}}'
data-price='{{custom_excerpt}}'
data-image='{{img_url feature_image size="xs"}}'>
Agregar al carrito
</button>

Потом agreguГ© признак 'пойдите' к select неудар в лунку. В твой случай я поместил 'id' стоимость, что tenГ - в в 'ямсе':

<select id="talle" name="talle">
    <option value="s">S</option> 
    <option value="m" selected>M</option>
    <option value="l">L</option>
    <option value="xl">XL</option>
</select>

В конце концов, Javascript:

//Referencia al botón mediante su id
let boton = document.getElementById('btn1');
//Referencia al select input mediante su id
let selectInput = document.getElementById('talle'); 
//Evento on click en nuestro botón
boton.addEventListener("click", function(){ 
//Obtengo el 'value' de la opción seleccionada en el input
let opcionSeleccionada = selectInput.options[selectInput.selectedIndex].value; 
//Le agrego el nuevo atributo, que lo llamé 'talle', y le doy de value la opción seleccionada.
boton.setAttribute("talle", opcionSeleccionada); 
}); 
0
ответ дан 01.12.2019, 12:36
  • 1
    Большое спасибо, có mo я могу делать, что вышеупомянутая информация tambié n появитесь в " восходи - label" а именно, {{title}} + " talle" в кнопке. Спасибо снова. – Gabriel 07.11.2019, 01:41
  • 2
    Не за что. Чтобы это делать obtendrí хозяева сначала value ' восходи - label' потом мы это прилагаем с ' talle' и потом мы посылаем эту новую стоимость снова в ' восходи - label': let dataLabel = boton.getAttribute("data-label"); let nuevoValor = dataLabel + opcionSeleccionada; boton.setAttribute("data-label", nuevoValor); – Sushi-22 07.11.2019, 15:17
  • 3
    Спасибо снова; из-за algú n мотив я не функционирует (нет ningú n ошибка в консоли chrome), рукописный шрифт не изменяет " восходи - label" я буду изменять post, чтобы появляться, как у меня есть có я говорю. – Gabriel 08.11.2019, 03:28
  • 4
    Здравствуйте. botó n у него нет id. – Sushi-22 08.11.2019, 19:11
  • 5
    Привет, если у него есть только, который в одиноком post он изменил добавляя часть javascript, ahí я изменяю другой tambié n así он не запутывает. – Gabriel 08.11.2019, 19:47