Can anyone give me a hand with this?
I am trying to obtain different values depending which button is clicked and assign it into a variable.
A friend told me to add the values in an input to later by extracted by e.currentTarget but I was unable to make it work.
HTML:
<div class="curso-contenedor">
<div class="curso">
<input id="precio" value='12000' hidden>
<input id="cursoNombre" value='Web Developer' hidden>
<form><button class="btn-curso web-developer" id="webDeveloper">Agregar</button></form>
</div>
<div class="curso">
<input id="precio" value='13000' hidden>
<input id="cursoNombre" value='Marketing Digital' hidden>
<form><button class="btn-curso marketing-Digital" id="marketinDigital">Agregar</button></form>
</div>
</div>
jQuery:
$('.btn-curso').click(function(e){
let curso = {'precio': e.currentTarget('#precio'), 'curso': e.currentTarget('#cursoNombre')};
localStorage.setItem('datosCurso', JSON.stringify(curso));
e.preventDefault()
});
If anyone knows how to do this it would mean the world if you can help me since I have been trapped with this for days now trying different things.
Try this: HTML
<div class="curso-contenedor">
<div class="curso">
<input name="precio" value='12000' hidden>
<input name="cursoNombre" value='Web Developer' hidden>
<button class="btn-curso web-developer" id="webDeveloper">Agregar</button>
</div>
<div class="curso">
<input name="precio" value='13000' hidden>
<input name="cursoNombre" value='Marketing Digital' hidden>
<button class="btn-curso marketing-Digital" id="marketinDigital">Agregar</button>
</div>
</div>
JQuery:
$('.curso-contenedor').on('click', '.curso', function(e){
let curso = {
'precio': $(e.currentTarget).find('input[name=precio]').val(),
'curso': $(e.currentTarget).find('input[name=cursoNombre]').val()
};
localStorage.setItem('datosCurso', JSON.stringify(curso));
e.preventDefault()
});
You should add delegate event listener to parent element
For more information: https://api.jquery.com/on/