handle empty/unchecked/checked checkboxes properly in both react and forms

This commit is contained in:
Jonathan Labreuille
2016-07-01 14:14:01 +02:00
parent 9de3a245b0
commit a8ffbc2d0e
2 changed files with 6 additions and 4 deletions

View File

@@ -6,7 +6,7 @@ function(
) {
const FormFieldCheckbox = React.createClass({
onValueChange: function(e) {
e.target.value = this.refs.checkbox.checked ? '1' : '';
e.target.value = this.refs.checkbox.checked ? '1' : '0';
return this.props.onValueChange(e);
},
render: function() {
@@ -14,7 +14,9 @@ function(
return false;
}
const isChecked = !!(this.props.item[this.props.field.name]);
// isChecked will be true only if the value is "1"
// it will be false in case value is "0" or empty
const isChecked = !!(~~(this.props.item[this.props.field.name]));
const options = Object.keys(this.props.field.values).map(
(value, index) => {
return (

View File

@@ -22,7 +22,7 @@ class Checkbox extends Base {
foreach($options as $option) {
$html .= '<label class="mailpoet_checkbox_label">';
$html .= '<input type="hidden" name="'.$field_name.'" value="" />';
$html .= '<input type="hidden" name="'.$field_name.'" value="0" />';
$html .= '<input type="checkbox" class="mailpoet_checkbox" ';
$html .= 'name="'.$field_name.'" ';
@@ -34,7 +34,7 @@ class Checkbox extends Base {
$selected_value === ''
&& isset($option['is_checked'])
&& $option['is_checked']
) || ($selected_value === $value)
) || ($selected_value)
) ? 'checked="checked"' : '';
$html .= $field_validation;