Radiobutton .val() returns not null value even if none of radiobuttons is selected

Question

I have 3 groups of radiobuttons, all of them properly named. On submit() I want to check if user selected option from each of groups.

I do that that way:

 $('.form').submit(function(){
      var selectedUser = $('input[name="selectedUser"]').val();
      var searchType = $('input[name="shareType"]').val();
      var selectedSearch = $('input[name="selectedSearch"]').val();
      console.log(selectedUser, searchType, selectedSearch);

      return false; //for testing purposes
    });

The problem is that each of three variables return not null values even if none of radiobuttons is selected.

Fact that might be important: each of groups contains more than 1 radiobutton, each radiobutton has distinct value.

duplicate of http://stackoverflow.com/questions/4138859/jquery-how-to-get-selected-radio-button-value — Ram Singh, Oct 28 '13 at 13:04

score 2 · Answer 1 · answered Oct 28 '13 at 13:01

You need to test if the radio is selected, you can do this using the :checked pseudo-selector:

  var selectedUser = $('input[name="selectedUser"]:checked').val();
  var searchType = $('input[name="shareType"]:checked').val();
  var selectedSearch = $('input[name="selectedSearch"]:checked').val();
  if(selectedUser || searchType || selectedSearch) {
      // At least one selected
  }
  else {
      // None selected
      return false;
  }

Here is a fiddle which demonstrates.

I thought that radiobutton `val()` works the same way as in ``. Thanks! — ex3v, Oct 28 '13 at 13:04

Radiobutton .val() returns not null value even if none of radiobuttons is selected

1 Answers1