Radio button returning undefined value in javascript

Question

Have a look at the fiddle link attached. Radio button value is returning a undefined value. I don't why. Please help with this.

<input type="radio" name="arv" value="1">1
<br>
<input type="radio" name="arv" value="2">2

var radio = document.getElementsByName('arv');
radio[0].addEventListener('click', check());
radio[1].addEventListener('click', check());

function check() {
for (var i = 0; i < radio.length; i++) {
    var rcheck = radio[i].checked;
    if (!rcheck) {
        alert(rcheck.value);

    }

}
}

Why use a whole framework for a simple onclick? In any case the () needs also to be removed from the ,click() — mplungjan
– mplungjan, Commented Mar 15, 2015 at 5:31

ngduc · Accepted Answer · 2015-03-15 05:29:25Z

2

Try this: http://jsfiddle.net/jngpjbjm/3/

It should be:

alert(radio[i].value);

Maybe you need something like this?

function check() { alert( event.target.value ); } http://jsfiddle.net/jngpjbjm/9/

answered Mar 15, 2015 at 5:29

ngduc

1,43112 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

mplungjan Over a year ago

You need tp address the wrongly assigned event handler too. Your fiddle - is event available in all browsers?

MaxZoom Over a year ago

You were very close though

Syno Over a year ago

Second fiddle doesnt work: ReferenceError: event is not defined

Ally Jr · Accepted Answer · 2015-03-15 05:40:06Z

2

I have tried to remove all excessive code from your original script as being unnecessary (kind of), whats left are the bare essentials. thanks @mplungjan

Try this:

var radio = document.getElementsByName('arv');
// here is how to add event listeners like the pros over at MDN
radio[0].addEventListener('click', check, false);
radio[1].addEventListener('click', check, false);

  function check(e) {
//simply grab the event by passing it as "e" and capturing its target.value
        var rcheck = e.target.value;
            alert(rcheck);

    }

edited Mar 15, 2015 at 5:40

answered Mar 15, 2015 at 5:31

Ally Jr

1,0752 gold badges15 silver badges27 bronze badges

1 Comment

mplungjan Over a year ago

True. Perhaps mention that? And also that older IEs will not understand the addEventListener

Fahim · Accepted Answer · 2015-03-15 05:37:43Z

0

Use this

var radio = document.getElementsByName('arv');
radio[0].addEventListener('click', check);
radio[1].addEventListener('click', check);

function check() {
for (var i = 0; i < radio.length; i++) {
    var rcheck = radio[i].checked;
    if (!rcheck) {
        alert(radio[i].value);

    }

}
}

answered Mar 15, 2015 at 5:37

Fahim

12.4k5 gold badges42 silver badges57 bronze badges

Comments

mplungjan · Accepted Answer · 2015-03-15 17:03:09Z

0

This version will work in all browsers.

window.onload=function() {
  var radios = document.getElementsByName('arv');
  for (var i=0;i<radios.length;i++) {
    radios[i].onclick=function() {
      alert(this.value);
    }
  }
}

onclick

Because it was essentially part of DOM 0, this method is very widely supported and requires no special cross–browser code; hence it is normally used to register event listeners dynamically unless the extra features of addEventListener() are needed.

edited Mar 15, 2015 at 17:03

answered Mar 15, 2015 at 16:57

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Collectives™ on Stack Overflow

Radio button returning undefined value in javascript

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related