If input.val() is in Array

Question

I need to check if the value of the radio:checked or the user input is equal to a radio group. There are several input radio groups. I store each radio group in array.

I am trying to get the user input and checking if it exist in array of the radio group please help.

var userInput = $(this).val();
  radioGroupOne = $(value).find('input[name="optionOne"]').map(function() {
    return this.value
  }).get().join(", "),
  radioGroupTwo = $(value).find('input[name="optionTwo"]').map(function() {
    return this.value
  }).get().join(", ");



  if ($.inArray(userInput, radioGroupOne) >= 0) {
    alert(userInput + 'is in group one');
  }
  
  if ($.inArray(userInput, radioGroupTwo) >= 0) {
    alert(userInput + 'is in group Two');
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<br>
<label class="title">Group one</label>
<fieldset class="options-block">
  <input type="radio" name="optionOne" value="red">
  <label>Red</label>
  <input type="radio" name="optionOne" value="blue">
  <label>Blue</label>
  <input type="radio" name="optionOne" value="green">
  <label>Green</label>
</fieldset>
<br>
<label class="title">Group two</label>
<fieldset class="options-block">
  <input type="radio" name="optionTwo" value="banana">
  <label>banana</label>
  <input type="radio" name="optionTwo" value="grape">
  <label>grape</label>
  <input type="radio" name="optionTwo" value="lemon">
  <label>lemon</label>
</fieldset>

<br>

if i click the Red radio it would show an alert Radio group one? is this your expected result? — vsogrimen
– vsogrimen, Commented Jan 14, 2016 at 0:49

vsogrimen · Accepted Answer · 2016-01-14 01:13:37Z

1

You just have to add a class in each option of the group and monitor the change event.

OR

use the name of the input $('input[name="optionOne" ]').change() as suggested by @OmarYafer

Try this.

/*
$('.g1').change(function () {
    alert('Group One');
})

$('.g2').change(function () {
    alert('Group Two');
})
*/

//@OmarYafer's solution:

$('input[name="optionOne" ]').change(function () {
    alert('Group One');
})

$('input[name="optionTwo" ]').change(function () {
    alert('Group Two');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<br>
<label class="title">Group one</label>
<fieldset class="options-block">
  <input class="g1" type="radio" name="optionOne" value="red">
  <label>Red</label>
  <input class="g1" type="radio" name="optionOne" value="blue">
  <label>Blue</label>
  <input class="g1" type="radio" name="optionOne" value="green">
  <label>Green</label>
</fieldset>
<br>
<label class="title">Group two</label>
<fieldset class="options-block">
  <input class="g2" type="radio" name="optionTwo" value="banana">
  <label>banana</label>
  <input class="g2" type="radio" name="optionTwo" value="grape">
  <label>grape</label>
  <input class="g2" type="radio" name="optionTwo" value="lemon">
  <label>lemon</label>
</fieldset>

<br>

I hope this has given you some idea.

~vsogrimen

edited Jan 14, 2016 at 1:13

answered Jan 14, 2016 at 0:59

vsogrimen

4562 silver badges7 bronze badges

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

5 Comments

Omar Yafer Over a year ago

You don´t actually need to add a class. You can select the first radio group with $('input[name="optionOne"]') instead of $('.g1')

vsogrimen Over a year ago

@OmarYafer yeah, nice.... Thanks for the suggestion, I'll be editing my answer :)

Omar Yafer Over a year ago

Actually your answer is great as is, but the jQuery ( "[attributeFilter1][attributeFilter2][attributeFilterN]" ) selection style can very handy when you need to select things that are hard to express using classes. So it is very nice to know there are optional ways of doing the same thing,

Vinay Kashyap Over a year ago

Yes this is simple and nice solution but in my case the all this is already happening inside a .change function so if i add another .change then user has to click twice. :|

vsogrimen Over a year ago

I cannot fully understand what is the scenario. Can you create a snippet to recreate the scenario of the problem?

Collectives™ on Stack Overflow

If input.val() is in Array

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related