Checking XPages Radio buttons have been selected with jQuery

So I found out the other day that an XPages Radio Button Group idTag is not resolved using the server side #{id:RadioButtonGroup}

Cert Next Year Needed Radio Button Group
Cert Next Year Needed Radio Button Group

Creates the following HTML on the webpage (in this example my RadioButtonGroup is called CertNextYearNeeded)

<label class="xspRadioButton" for="view:_id1:_id2:_id18:radio1">
<input id="view:_id1:_id2:_id18:radio1" type="radio" name="view:_id1:_id2:_id18:CertNextYearNeeded" value="No" />No</label
<label class="xspRadioButton" for="view:_id1:_id2:_id18:radio2">
<input id="view:_id1:_id2:_id18:radio2" type="radio" name="view:_id1:_id2:_id18:CertNextYearNeeded" value="Yes"/>Yes</label>

however using the # notation in my SSJS I got the following….(Using x$)


x$("#{id:CertNextYearNeeded}", ":checked").val()!="Yes"

came through into the webpage source code as


x$(":checked").val()!="Yes"

so therefore we need to select by name (which I don’t like as it could be ambiguous, but have no choice) you have to select the radio button group by name (don’t use x$). In this case we are testing to see if “Yes” has been selected – No or no selection at all will fail.

if ($("[name$=CertNextYearNeeded]:checked").val() != 'Yes') {
    msg="Select the option\n";
}
  • [name$=CertNextYearNeeded] <— Selects all elements with a name like *CertNextYearNeeded
  • :checked <—- get the checked
  • element .val() <— get the value
Advertisements

2 thoughts on “Checking XPages Radio buttons have been selected with jQuery

  1. Hi,

    to access the group name of a radio button in SSJS you can do the following:

    #{javascript:getComponent(“radio1”).getClientGroupName( facesContext, getComponent(“radio1”))}

    Sven

    • Sven – thanks for the response – Genius !! That is really good to know !

      alert(“#{javascript:getComponent(“radio1”).getClientGroupName( facesContext, getComponent(“radio1″))}”)
      response: view:_id1:_id2:_id18:CertNextYearNeeded

      saying that – this is now rather ugly code and I might just stick with the original

      “x$([name$=”+#{javascript:getComponent(“radio1”).getClientGroupName( facesContext, getComponent(“radio1″))}+”]:checked”)
      or
      $(“[name$=CertNextYearNeeded]:checked”)

      both return the same jQuery object

      thanks again!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s