I’m currently in the process of converting a ExtJS 3 application to ExtJS 4. One of the things ExtJS 3 couldn’t do is submit the value of an unchecked checkbox. Checkboxes only have a value when they are checked.
Two situations where it’s nice to send an unchecked value to the server:
- when sending deltas (the changed fields), the server-side code would never know if a checkbox was unchecked
- when the form is dynamically generated and you want to prevent server-side code to find out if a checkbox was present and maybe unchecked
XCheckbox written by Jsakalos did a nice job for older versions of ExtJS.
In ExtJS 4 you can use the checkbox provided by the framework, just make sure you set the ‘uncheckedValue‘ property.
Example:
Ext.define('App.view.CheckTest', {
extend: 'Ext.form.Panel',
alias: 'widget.checktest',
buttons: [{
text: 'Submit',
handler: function(button, event) {
var form = button.up('form').getForm();
form.submit();
}
}],
defaultType: 'checkbox',
items: [{
boxLabel: 'Agree with TOS',
inputValue: 'true',
name: 'agreeTOS',
uncheckedValue: 'false'
}],
title: 'Terms of service agreement',
url: '/submitURL'
});
When leaving the checkbox unchecked it will submit “false”.