How to get a regular Checkbox in a Zend Form

checkboxzend-formzend-framework

I have a form in Zend_Form that needs some checkboxes and I'd like them to be regular old checkboxes. You know, you give em a name and a value. If they are checked your post data contains name=>value.

Zend_Form is generating two inputs fields. One, the checkbox with a value=1 and the second a hidden input with a value=2. Both have the same name. I understand in theory how Zend expects the checkbox to work, but that's not how I expect it to work and it's not how I want it to work. How do I get my old fashion HTML checkbox back?

I have tried using $this->createElement, $this->addElement and creating a Zend_Form_Element_Checkbox manually. None allow me to set the checkbox's value and all generate the hidden input.

Best Answer

The final and REALLY correct answer is to add an option to the element :

$this->addElement('checkbox', 'my_element', array(
    'label' => 'My Element Label',
    'name' => 'my_element_name',
    'disableHidden' => true
));

Modern jQuery

Use .prop():

$('.myCheckbox').prop('checked', true);
$('.myCheckbox').prop('checked', false);

DOM API

If you're working with just one element, you can always just access the underlying HTMLInputElement and modify its .checked property:

$('.myCheckbox')[0].checked = true;
$('.myCheckbox')[0].checked = false;

The benefit to using the .prop() and .attr() methods instead of this is that they will operate on all matched elements.

jQuery 1.5.x and below

The .prop() method is not available, so you need to use .attr().

$('.myCheckbox').attr('checked', true);
$('.myCheckbox').attr('checked', false);

Note that this is the approach used by jQuery's unit tests prior to version 1.6 and is preferable to using $('.myCheckbox').removeAttr('checked'); since the latter will, if the box was initially checked, change the behaviour of a call to .reset() on any form that contains it – a subtle but probably unwelcome behaviour change.

For more context, some incomplete discussion of the changes to the handling of the checked attribute/property in the transition from 1.5.x to 1.6 can be found in the version 1.6 release notes and the Attributes vs. Properties section of the .prop() documentation.

Javascript – How to check whether a checkbox is checked in jQuery

How do I successfully query the checked property?

The checked property of a checkbox DOM element will give you the checked state of the element.

Given your existing code, you could therefore do this:

if(document.getElementById('isAgeSelected').checked) {
    $("#txtAge").show();
} else {
    $("#txtAge").hide();
}

However, there's a much prettier way to do this, using toggle:

$('#isAgeSelected').click(function() {
    $("#txtAge").toggle(this.checked);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is something</div>

Best Answer

Related Solutions

Javascript – Setting “checked” for a checkbox with jQuery

Modern jQuery

DOM API

jQuery 1.5.x and below

Javascript – How to check whether a checkbox is checked in jQuery

Related Topic