responsive show/hide for checkboxes

This commit is contained in:
Roland Gruber 2017-12-17 11:44:28 +01:00
parent 400827889a
commit 9efa8507df
1 changed files with 38 additions and 7 deletions

View File

@ -1926,22 +1926,23 @@ class htmlInputCheckbox extends htmlElement {
// build Java script to show/hide depending fields // build Java script to show/hide depending fields
$onChange = ''; $onChange = '';
$script = ''; $script = '';
$selector = $this->getShowHideSelector();
if ((sizeof($this->tableRowsToShow) > 0) || (sizeof($this->tableRowsToHide) > 0)) { if ((sizeof($this->tableRowsToShow) > 0) || (sizeof($this->tableRowsToHide) > 0)) {
// build onChange listener // build onChange listener
$onChange .= 'if (jQuery(\'#' . $this->name . ':checked\').val() !== undefined) {'; $onChange .= 'if (jQuery(\'#' . $this->name . ':checked\').val() !== undefined) {';
for ($i = 0; $i < sizeof($this->tableRowsToShow); $i++) { for ($i = 0; $i < sizeof($this->tableRowsToShow); $i++) {
$onChange .= 'jQuery(\'#' . $this->tableRowsToShow[$i] . '\').closest(\'tr\').removeClass(\'hidden\');'; $onChange .= 'jQuery(\'#' . $this->tableRowsToShow[$i] . '\').closest(\'' . $selector . '\').removeClass(\'hidden\');';
} }
for ($i = 0; $i < sizeof($this->tableRowsToHide); $i++) { for ($i = 0; $i < sizeof($this->tableRowsToHide); $i++) {
$onChange .= 'jQuery(\'#' . $this->tableRowsToHide[$i] . '\').closest(\'tr\').addClass(\'hidden\');'; $onChange .= 'jQuery(\'#' . $this->tableRowsToHide[$i] . '\').closest(\'' . $selector . '\').addClass(\'hidden\');';
} }
$onChange .= '}'; $onChange .= '}';
$onChange .= 'else {'; $onChange .= 'else {';
for ($i = 0; $i < sizeof($this->tableRowsToShow); $i++) { for ($i = 0; $i < sizeof($this->tableRowsToShow); $i++) {
$onChange .= 'jQuery(\'#' . $this->tableRowsToShow[$i] . '\').closest(\'tr\').addClass(\'hidden\');'; $onChange .= 'jQuery(\'#' . $this->tableRowsToShow[$i] . '\').closest(\'' . $selector . '\').addClass(\'hidden\');';
} }
for ($i = 0; $i < sizeof($this->tableRowsToHide); $i++) { for ($i = 0; $i < sizeof($this->tableRowsToHide); $i++) {
$onChange .= 'jQuery(\'#' . $this->tableRowsToHide[$i] . '\').closest(\'tr\').removeClass(\'hidden\');'; $onChange .= 'jQuery(\'#' . $this->tableRowsToHide[$i] . '\').closest(\'' . $selector . '\').removeClass(\'hidden\');';
} }
$onChange .= '};'; $onChange .= '};';
// build script to set initial state // build script to set initial state
@ -1951,14 +1952,14 @@ class htmlInputCheckbox extends htmlElement {
if ($this->checked) { if ($this->checked) {
$classType = 'removeClass'; $classType = 'removeClass';
} }
$script .= 'jQuery(\'#' . $this->tableRowsToShow[$i] . '\').closest(\'tr\').' . $classType . '(\'hidden\');'; $script .= 'jQuery(\'#' . $this->tableRowsToShow[$i] . '\').closest(\'' . $selector . '\').' . $classType . '(\'hidden\');';
} }
for ($i = 0; $i < sizeof($this->tableRowsToHide); $i++) { for ($i = 0; $i < sizeof($this->tableRowsToHide); $i++) {
$classType = 'removeClass'; $classType = 'removeClass';
if ($this->checked) { if ($this->checked) {
$classType = 'addClass'; $classType = 'addClass';
} }
$script .= 'jQuery(\'#' . $this->tableRowsToHide[$i] . '\').closest(\'tr\').' . $classType . '(\'hidden\');'; $script .= 'jQuery(\'#' . $this->tableRowsToHide[$i] . '\').closest(\'' . $selector . '\').' . $classType . '(\'hidden\');';
} }
$script .= '});</script>'; $script .= '});</script>';
} }
@ -2078,6 +2079,13 @@ class htmlInputCheckbox extends htmlElement {
$this->elementsToEnable = $elements; $this->elementsToEnable = $elements;
} }
/**
* Returns the CSS selector to use to find show/hide elements.
*/
protected function getShowHideSelector() {
return '.tr';
}
} }
/** /**
@ -3574,6 +3582,8 @@ class htmlResponsiveRow extends htmlElement {
/** @var htmlResponsiveCell[] cells */ /** @var htmlResponsiveCell[] cells */
private $cells = array(); private $cells = array();
/** HTML ID */
private $id = null;
/** /**
* Creates a new responsive row. * Creates a new responsive row.
@ -3591,6 +3601,15 @@ class htmlResponsiveRow extends htmlElement {
} }
} }
/**
* Sets the HTML id.
*
* @param string $id ID
*/
public function setId($id) {
$this->id = $id;
}
/** /**
* Adds a responsive cell to the row. * Adds a responsive cell to the row.
* *
@ -3648,7 +3667,11 @@ class htmlResponsiveRow extends htmlElement {
public function generateHTML($module, $input, $values, $restricted, &$tabindex, $scope) { public function generateHTML($module, $input, $values, $restricted, &$tabindex, $scope) {
$return = array(); $return = array();
$cssClasses = implode(' ', $this->cssClasses); $cssClasses = implode(' ', $this->cssClasses);
echo '<div class="row ' . $cssClasses . '">'; $idParam = '';
if ($this->id !== null) {
$idParam = ' id="' . $this->id . '"';
}
echo '<div class="row ' . $cssClasses . '"' . $idParam . '>';
foreach ($this->cells as $cell) { foreach ($this->cells as $cell) {
$return = array_merge($return, $cell->generateHTML($module, $input, $values, $restricted, $tabindex, $scope)); $return = array_merge($return, $cell->generateHTML($module, $input, $values, $restricted, $tabindex, $scope));
} }
@ -4107,6 +4130,14 @@ class htmlResponsiveInputCheckbox extends htmlInputCheckbox {
return $row->generateHTML($module, $input, $values, $restricted, $tabindex, $scope); return $row->generateHTML($module, $input, $values, $restricted, $tabindex, $scope);
} }
/**
* {@inheritDoc}
* @see htmlInputCheckbox::getShowHideSelector()
*/
protected function getShowHideSelector() {
return '.row';
}
} }
/** /**