Setting checkbox value using Javascript

Question

I have a checkbox tag lets say checkbox1:

<TL:FWCheckBoxTag bean="<%=abc %>"  tabindex="23"/>

I want to send two different values (value attribute) for the checkbox, based on if they checked or not.

For example if people check the checkbox i want to send "aa" and if its not checked i wanna send "bb".

How can i do it?

Natively, a checkbox will send name=value if it's checked. Perhaps you could use a hidden form field, and set that to aa if your checkbox is checked, otherwise bb? — Mike Christensen
– Mike Christensen, Commented Mar 28, 2013 at 22:45

jszobody · Accepted Answer · 2013-03-28 23:01:36Z

You can add value="aa" to your checkbox, and that will be the value sent if the box is checked. Native checkboxes don't have a way to send an 'unchecked' value. You either have to check server-side if the checked value is missing, or implement a javascript workaround.

One way to work around this in javascript would be to have a hidden field with the real value, and hook up an event to the checkbox to toggle the value of the hidden field.

Here is a native HTML example using jQuery to hook up the workaround:

<input type="hidden" name="myrealtextboxvalue" id="myrealtextboxvalue" value="bb"/>
<input type="checkbox" name="toggle" id="toggle"/> Check me

<script>
$(document).ready(function() {
   $("#toggle").change(function() {
      if($(this).is(":checked")) $("#myrealtextboxvalue").val("aa");
      else $("#myrealtextboxvalue").val("bb");
   });
});
</script>

You would then look for the "myrealtextboxvalue" server side to find your 'aa' or 'bb' value.

Working example: http://jsbin.com/agucer/1/edit

(I made the input visible so you could see the change take place, you'd change type="hidden" like I have above)

Collectives™ on Stack Overflow

Setting checkbox value using Javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related