Permalink
Browse files

feature(forms): input/checkbox is now usable with elgg_view_input()

Adds an exception to elgg_view_input() to render the label next to the checkbox input
rather than above the input (as in other input types).
Adds default class for single checkbox inputs wrapped in an html tag with a label
(.elgg-input-single-checkbox)
Adds an option to customize the HTML tag used to wrap the single checkbox input with a label
to avoid double wrapping with a \<label\> tag.

Fixes #9808
  • Loading branch information...
hypeJunction committed Jun 13, 2016
1 parent d649724 commit 82bbf49bd9da83fbc160f5c83c241db772d1ae8d
View
@@ -1348,7 +1348,13 @@ function elgg_view_input($input_type, array $vars = array()) {
$vars['input_type'] = $input_type;
$label = elgg_view('elements/forms/label', $vars);
unset($vars['label']);
if ($input_type == 'checkbox') {
$vars['label'] = $label;
$vars['label_tag'] = 'div';
$label = false;
} else {
unset($vars['label']);
}
$help = elgg_view('elements/forms/help', $vars);
unset($vars['help']);
@@ -74,6 +74,10 @@
border: none;
width: auto;
}
.elgg-input-checkbox + label,
.elgg-input-checkbox + .elgg-field-label {
display: inline-block;
}
.elgg-input-checkboxes.elgg-horizontal li,
.elgg-input-radios.elgg-horizontal li {
display: inline;
@@ -30,6 +30,16 @@
'label' => 'Radio input (.elgg-input-radios):',
));
echo elgg_view_input('checkbox', array(
'name' => 'f4s',
'id' => 'f4s',
'value' => 1,
'default' => false,
'required' => true,
'label' => 'a (.elgg-input-checkbox)',
'help' => 'Single checkbox .elgg-input-checkbox wrapped in .elgg-input-single-checkbox',
));
echo elgg_view_input('checkboxes', array(
'name' => 'f4',
'id' => 'f4',
@@ -592,6 +592,11 @@
max-width: 800px;
}
.elgg-input-checkbox + label,
.elgg-input-checkbox + .elgg-field-label {
display: inline-block;
}
/* **************************************
DATE PICKER
*************************************** */
@@ -76,6 +76,10 @@
border-radius:0;
width:auto;
}
.elgg-input-checkbox + label,
.elgg-input-checkbox + .elgg-field-label {
display: inline-block;
}
.elgg-input-checkboxes.elgg-horizontal li,
.elgg-input-radios.elgg-horizontal li {
display: inline;
@@ -18,6 +18,7 @@
* @uses $vars['label'] Optional label string
* @uses $vars['class'] Additional CSS class
* @uses $vars['label_class'] Optional class for the label
* @uses $vars['label_tag'] HTML tag that wraps concatinated label and input. Defaults to 'label'.
*/
$vars['class'] = (array) elgg_extract('class', $vars, []);
@@ -39,14 +40,16 @@
}
$label = elgg_extract('label', $vars, false);
$label_class = elgg_extract('label_class', $vars);
$label_class = (array) elgg_extract('label_class', $vars, []);
$label_class[] = 'elgg-input-single-checkbox';
unset($vars['label']);
unset($vars['label_class']);
$input = elgg_format_element('input', $vars);
if (!empty($label)) {
echo elgg_format_element('label', ['class' => $label_class], "$input $label");
$html_tag = elgg_extract('label_tag', $vars, 'label', false);
echo elgg_format_element($html_tag, ['class' => $label_class], "$input $label");
} else {
echo $input;
}

0 comments on commit 82bbf49

Please sign in to comment.