How to get value from html input radio and put it in input hidden field in jsp java

Question

I have the code for radio buttons

<input type="radio" name="opt" id="1" value="1"/><label for="1">${dto.quesOpt1}</label>
<br/>
<input type="radio" name="opt" id="2" value="2"/><label for="2">${dto.quesOpt2}</label>
<br/>
<input type="radio" name="opt" id="3" value="3"/><label for="3">${dto.quesOpt3}</label>
<br/>
<input type="radio" name="opt" id="4" value="4"/><label for="4">${dto.quesOpt4}</label>

And I want to put the value here so I can pass it to my Servlet

<form action="MainController" method="POST">
       <input type="hidden" name="quesNum" value="${requestScope.QUESNUM}"/>
       <input type="hidden" name="quesId" value="${dto.quesId}"/>
       <input type="hidden" name="quesChoice" value="${param.opt}"/>               <--------- here
       <input type="hidden" name="amount" value="${requestScope.AMOUNT}"/>
       <input type="hidden" name="action" value="Previous Question"/>
       <input type="submit" value="Previous" <c:if test="${requestScope.QUESNUM == 0}">disabled</c:if>/>
</form>

I always get null value in Servlet

request.getParameter("quesChoice")

I don't know how to pass the value. Please guide me. Thank you.

score 0 · Accepted Answer · answered Jun 01 '20 at 18:56

What you're trying to do is execute server side code (like ${dto.quesId}) inside the browser. You cannot do that.

What you're trying to do is super nasty and is probably not the right way to go. You probably don't need to copy the values from the radio to the form as you can put the radios directly inside the form.
JSPs are a super old technology that most companies have already abandoned years ago and those that still use it, plan to abandon it.
If you really have to use JSPs, your life would be much easier if you used JSTL libraries and MKYoung has some awesome tutorial on how to handle a lot of old java issues, including the one you're struggling with right now: https://mkyong.com/spring-mvc/spring-mvc-radiobutton-and-radiobuttons-example/
If you say "fuck it, I want to code it the way I was planning to do that all along anyway", you still need JavaScript to copy your values as this is the JavaScript that handles the browser-side actions.

Having said all that, this is how you can do it with pure JS:

<html>
  <script>
    function copyValue() {
  let allOptions = Array.prototype.slice.call(document.getElementsByName('opt'));
  let selectedOption = allOptions.filter(opt => opt.checked)[0];
  let selectedOptionValue = selectedOption ? selectedOption.value : undefined;
  document.getElementById('quesNum').value = selectedOptionValue;
}
  </script>
  <body>
    <input type="radio" name="opt" id="1" value="1"/><label for="1">${dto.quesOpt1}</label>
    <br/>
    <input type="radio" name="opt" id="2" value="2"/><label for="2">${dto.quesOpt2}</label>
    <br/>
    <input type="radio" name="opt" id="3" value="3"/><label for="3">${dto.quesOpt3}</label>
    <br/>
    <input type="radio" name="opt" id="4" value="4"/><label for="4">${dto.quesOpt4}</label>

    <input type="hidden" name="quesNum" id="quesNum" value="${requestScope.QUESNUM}"/>

    <input type="button" value="Copy Value" onClick="copyValue()"/>
  </body>
</html>

Note how I had to add the id="quesNum" and then the onClick="copyValue()" to trigger an action.

Here's the example in JSFiddle if you want to play with it: https://jsfiddle.net/kgjanowski/5ymubn6v/22/

Thank you so much. I'm learning Java Web at school and this is what the teachers have taught me. I didn't realise that I was executing server side code on the browser. Thanks again for showing me some awesomely new things. — Thien, Jun 01 '20 at 19:21

How to get value from html input radio and put it in input hidden field in jsp java

1 Answers1