Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #38456

Re: Multiple inputs with same event

Show all headers | View raw

Am 08.06.20 um 03:39 schrieb Andrew Poulos:
> On 8/06/2020 5:56 am, Michael Haufe (TNO) wrote:
>> On Saturday, June 6, 2020 at 7:36:36 PM UTC-5, Andrew Poulos wrote:
>>> I have a page with lots of input elements on it. The state of the
>>> inputs determines the content of a "preview pane". Rather than have
>>> the pane update continually as a, say, number field is incremented
>>> it waits for a blur event to trigger.
>>>
>>> A function then reads the state of the inputs and updates the pane 
>>> accordingly.
>>>
>>> Attaching a blur event to every input that calls the same update 
>>> function seems very inefficient. Actually, for some inputs like 
>>> checkboxes just selecting them should call the update function.
>>>
>>> Is there a way for multiple inputs to call the same function when
>>> the same event occurs to any of them without directly attaching the
>>> event to each input? Or should a just write a function that
>>> dynamically attaches the required events?
>>
>> If you wrap all of your elements in a <form> tag you can attach an
>> eventListener to that form and capture any "change" event:
>>
>> ```html <form id="myForm"> <input name="a"> <input name="b"> <input
>> name="c"> </form> ```
>>
>> ```js let myForm = document.getElementById('myForm')
>>
>> myForm.addEventListener('change', (e) => { console.log(e) }) ```
> 
> Doing this and then parsing e.target gives me the type, id and other
> attributes. I'll try it this way.
> 
> Andrew Poulos

Be aware, that the blur event doesn't bubble:

https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Multiple inputs with same event Andrew Poulos <ap_prog@hotmail.com> - 2020-06-07 10:36 +1000
  Re: Multiple inputs with same event Arno Welzel <usenet@arnowelzel.de> - 2020-06-07 11:06 +0200
    Re: Multiple inputs with same event "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2020-06-07 13:09 +0200
      Re: Multiple inputs with same event Luuk <luuk@invalid.lan> - 2020-06-07 15:40 +0200
        Re: Multiple inputs with same event "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2020-06-08 00:37 +0200
          Re: Multiple inputs with same event Julio Di Egidio <julio@diegidio.name> - 2020-06-08 07:44 -0700
  Re: Multiple inputs with same event James Kirk <noneya.invalid@gmail.com> - 2020-06-07 10:30 -0400
  Re: Multiple inputs with same event JJ <jj4public@vfemail.net> - 2020-06-07 23:49 +0700
  Re: Multiple inputs with same event "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2020-06-07 12:56 -0700
    Re: Multiple inputs with same event Andrew Poulos <ap_prog@hotmail.com> - 2020-06-08 11:39 +1000
      Re: Multiple inputs with same event Gregor Kofler <usenet@gregorkofler.com> - 2020-06-08 11:33 +0200
    Re: Multiple inputs with same event Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2020-06-09 02:49 +0200
      Re: Multiple inputs with same event Andrew Poulos <ap_prog@hotmail.com> - 2020-06-10 17:19 +1000
        Re: Multiple inputs with same event Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2020-06-10 17:12 +0200
          Re: Multiple inputs with same event Andrew Poulos <ap_prog@hotmail.com> - 2020-06-11 15:43 +1000

csiph-web