Working with Joomla 4.0 beta 4 and I figured a forever occurring issue with Joomla, here are my two known cases:
<div class="control-label">
.type="Spacer"
is expected to have no input so no <div class="controls">
should be rendered.Why this is important?
Working with custom developed form fields often times requires that we override core form fields for specific functionality, but also just to get rid of the <div class="control-label">
(via a custom getLabel()
method) which creates an unwanted white space and could produce confusion to end-user due to inconsistent typographic spacing.
libraries/scr/Form/FormField.php
lines 808 - 813, allow the getLabel()
method to check if the field label is empty$data = $this->getLayoutData();
if ($this->hidden || empty($data['label']))
{
return '';
}
libraries/scr/Form/FormField.php
lines 1042 - 1047, allow the renderField()
method to push the field type into the layout, to check within the layout for a type="Spacer"
field and prevent the layout from rendering the <div class="controls">
, details later$data = array(
'input' => $this->getInput(),
'label' => $this->getLabel(),
'type' => $this->type,
'options' => $options,
);
layouts/joomla/form/renderfield.php
complete file<?php
/**
* @package Joomla.Site
* @subpackage Layout
*
* @copyright Copyright (C) 2005 - 2020 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
defined('_JEXEC') or die;
use Joomla\CMS\Factory;
extract($displayData);
/**
* Layout variables
* -----------------
* @var array $options Optional parameters
* @var string $name The id of the input this label is for
* @var string $label The html code for the label
* @var string $type The field type
* @var string $input The input field html code
* @var string $description An optional description to use in a tooltip
*/
if (!empty($options['showonEnabled']))
{
/** @var Joomla\CMS\WebAsset\WebAssetManager $wa */
$wa = Factory::getApplication()->getDocument()->getWebAssetManager();
$wa->useScript('showon');
}
$class = empty($options['class']) ? '' : ' ' . $options['class'];
$rel = empty($options['rel']) ? '' : ' ' . $options['rel'];
$id = $name . '-desc';
$hide = empty($options['hiddenLabel']) ? '' : ' sr-only';
?>
<div class="control-group<?php echo $class; ?>"<?php echo $rel; ?>>
<?php if (!empty($label)) : ?>
<div class="control-label<?php echo $hide; ?>"><?php echo $label; ?></div>
<?php endif; ?>
<?php if (ucfirst($type) !== 'Spacer') : ?>
<div class="controls">
<?php echo $input; ?>
<?php if (!empty($description)) : ?>
<div id="<?php echo $id; ?>">
<small class="form-text text-muted">
<?php echo $description; ?>
</small>
</div>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
type="Spacer"
is missing it's <div class="controls">
will it mess around with the overall form functionality? (my guess is that it doesn't or at least shouldn't)Title |
|
||||||
Labels |
Added:
?
|
Sup @brianteeman didn't expect your reply here. You must be right on that, however, the white space is not good man.
So make sure you have a label and you have no white space ;)
Thanks Brian for your input, however that is not exactly the full context, I now realize I should have pointed out more details in the first place.
Here are two main cases, each make a strong argument:
Take a field of type="Subform"
without label and a couple of type="Text"
child fields each having its own label, to have no label and no markup of the label for the type="Subform"
field is expected for a consistent spacing.
Take a field of type="Subform"
with own label and couple of type="Text"
child fields each having NO label, a consistent design would require no label and markup for the child fields.
Would appreciate more feedback on this.
Every field must have a label even if it is set to invisible
@thednp you talked about joomla fields and @brianteeman talked about "form inputs",
that different things ;)
"Spacer" is not "form input"
Status | New | ⇒ | Closed |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2020-10-16 15:07:45 |
Closed_By | ⇒ | thednp |
Every field must have a label. That is a basic accessibility rule