Question

I want to enable the input field when check box is checked. Also, I want to make a server side validation of the text field, to be filled, if the check box is selected, the problem I face is that when I make check for more than one and submit the form with empty values of the filed then make validation in the servlet and return the result to the user to fill the inputs, one of the check fields is checked and the other is not, even I use param for filed stability for both, I don’t know what is the reason!

Here’s the HTML code

 <div class="groupElement">

  <input type="checkbox" name="communicationWay" id="communicationWay2" value="emailOption" ${param.communicationWay == 'emailOption'?'checked':'' } onchange="chgtx('email','communicationWay2')"/>
  <label>Email</label>


     <input class="inpClass" id="email" type="text" name="emailComm" value="${param.emailComm}" disabled/>

</div>

 <div class="groupElement">

  <input type ="checkbox" name="communicationWay" id="communicationWay"  value="cellPhoneOption" ${param.communicationWay == 'cellPhoneOption'?'checked':''} onchange="chgtx('cellPhone','communicationWay')" />
   <label> Cell phone number</label>

    <input class="inpClass" id="cellPhone" type ="text" name="cellPhoneNoComm" value="${param.cellPhoneNoComm}" disabled />

     </div>

and here’s the java script function that trigger between enabling and disabling the input fields

 function chgtx(field, checkbox) {

            var myField = document.getElementById(field);
            var checkBtton = document.getElementById(checkbox);
            myField.disabled= !checkBtton.checked;

        }

Answer 1

Your checkbox elements have the same name. So in the server side you have to use request.getParameterValues() to get all checked values.

String[] communicationWays = request.getParameterValues("communicationWay");
// ...

When you use request.getParameter(), such as ${param} is doing, only one value will be returned, which is the first one of the group. You can use ${paramValues} to get all values in EL.

However, using ${paramValues} in EL to set the checked state isn’t exactly trivial. There are two ways to solve this:

1. Create a custom EL function which does something like

   ${util:contains(paramValues.communicationWays, 'emailOption') ? 'checked' : ''}
   ${util:contains(paramValues.communicationWays, 'phoneOption') ? 'checked' : ''}
   

   with a

   public static boolean contains(Object[] array, Object value) {
       Arrays.sort(array);
       return Arrays.binarySearch(array, value) > -1;
   }
   

2. Create a Map<String, Boolean> in servlet and use it instead in EL.

   Map<String, Boolean> communicationWays = new HashMap<String, Boolean>();
   request.setAttribute("communicationWays", communicationWays);
   
   for (String communicationWay : request.getParameterValues("communicationWay")) {
       communicationWays.put(communicationWay, true);
   }
   

   with

   ${communicationWays.emailOption ? 'checked' : ''}
   ${communicationWays.phoneOption ? 'checked' : ''}