Home > Software engineering >  How can I set some values using currentTarget with jQuery from different HTML elements?
How can I set some values using currentTarget with jQuery from different HTML elements?

Time:02-11

Ccan 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 >
        <div >

            <input id="precio" value='12000' hidden>
            <input id="cursoNombre" value='Web Developer' hidden>
        
            <form><button  id="webDeveloper">Agregar</button></form>
            
        </div>
        <div >

            <input id="precio" value='13000' hidden>
            <input id="cursoNombre" value='Marketing Digital' hidden>
            
            <form><button  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.

CodePudding user response:

Try this: HTML

    <div >
        <div >

            <input name="precio" value='12000' hidden>
            <input name="cursoNombre" value='Web Developer' hidden>
        
            <button  id="webDeveloper">Agregar</button>
            
        </div>
        <div >

            <input name="precio" value='13000' hidden>
            <input name="cursoNombre" value='Marketing Digital' hidden>
            
            <button  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/

  • Related