Advanced Search

require one of three Salsa group checkboxes to be selected

/ Published in: JavaScript
Save to your folder(s)
We set up a voting page, where supporters would choose one of three candidates (only two are shown in the snippet). By clicking the checkbox, the supporter would add themselves to a Salsa group. This way only one vote for a candidate by a supporter would count, it would be easy to find the count for each candidate, and it would be easy to find the supporters who picked each candidate.

We wanted to make it "required" to select one of the checkboxes, but we couldn't simply make the checkbox required because then supporters would be required to choose THAT checkbox. The solution was to add another field, called pac_voted, and make it a hidden field, and require THAT field to be filled out. Then we used the javascript shown here to fill out the pac_voted field whenever any of the groups checkboxes was selected. This way if no checkbox was selected, the error checking on the page reported that a required field was missing; but if any checkbox was checked, the page passed error checking.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <div style="background-color: rgb(255, 255, 204); padding: 5px; font-size: 12px; border: thin solid rgb(102, 136, 0);">
  2.     <label>
  3.         <input type="checkbox" name="groups_KEY659_checkbox" value="1" id="j1" onclick="radioME(this); copyContact(this);" /> 
  4.             <strong>Vote for Carol Shea Porter</strong>
  5.                 <input type="hidden" value="true" name="groups_KEY659_checkbox" value="1" id="j1" onclick="radioME(this); copyContact(this);" /> 
  6.     </label>
  7. </div>
  8.  
  9. <div style="background-color: rgb(255, 255, 204); padding: 5px; font-size: 12px; border: thin solid rgb(102, 136, 0);">
  10.     <label>
  11.         <input type="checkbox" onclick="radioME(this); copyContact(this);" id="j0" value="1" name="groups_KEY658_checkbox"/> 
  12.             <strong>Vote for Dan Seals</strong>
  13.      </label>
  14.  
  15.  
  16.  
  17.  
  18. <input type="hidden" value="" id="f1" name="pac_voted"/>
  19. <input type="hidden" name="required" value="Email,Zip,First_Name,pac_voted,"/>
  20.  
  21.  
  22.  
  23.  
  24. <script language="javascript">
  25. <!--
  26. function copyContact(tothing, fromthing) {
  27.  eval("document.actionForm.pac_voted.value = document.actionForm.groups_KEY658_checkbox.value");
  28. }
  29. //--></s

URL: http://act.truemajorityaction.org/p/salsa/web/common/public/content?content_item_KEY=49

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.