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

Groups > comp.lang.javascript > #38454

Re: Multiple inputs with same event

Show all headers | View raw

Luuk <luuk@invalid.lan> wrote on 07 Jun 2020 in comp.lang.javascript:

> On 7-6-2020 13:09, Evertjan. wrote:
>> Arno Welzel <usenet@arnowelzel.de> wrote on 07 Jun 2020 in
>> comp.lang.javascript:
>> 
>>> Andrew Poulos:
>>>
>>> [...]
>>>> 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?
>>>
>>> Without attaching the event to a handler there is handler at all.
>>>
>>> If you need different handlers for different input element types,
>>> iterate through the DOM and attach the handler depending on the type.
>>> one for blur events and another for checking or unchecking things.
>> 
>> Well no, the handler could test the sort/type of input on execution.
>> 
>> <input class='sort123' onblur='doIt(this)' ..
>> <input class='sort456' onblur='doIt(this)' ..
>> 
>> const doIt = (t) => {
>>           if (t.className == 'sort123') alert(t.value.toUpperCase());
>>           if (t.className == 'sort456') alert('456');
>>           // ..... or do nothing
>> };
>> 
>>> But however you do it - there is no other way than attaching an event
>>> handler to each input element. There is no gobal "some input has some
>>> change" event.
>> 
>> Quite.
>> 
> 
> or:
> 
> <input class='sort123' onblur='doIt(123, this)' ..
> <input class='sort456' onblur='doIt(456, this)' ..
> 
> const doIt = (i, t) => {
>           if (i == 123) alert(t.value.toUpperCase());
>           if (i == 456) alert('456');
>           // ..... or do nothing
>};

Well, but than you cannot exchange it with:

====================
<input><br>
<input class='sort123'><br>
<input class='sort456'><br>
<input><br>

<script>
document.querySelectorAll('input').forEach(
  function(someInput) {
    someInput.addEventListener('blur', 
      function() {
        if (this.className == 'sort123') alert(this.value.toUpperCase());
        if (this.className == 'sort456') alert('456');
        // do nothing for the first and the last<input>
      }
    )
  }
);
</script>
====================

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

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