Commit 19bb2c34 authored by Carsten  Rose's avatar Carsten Rose
Browse files

Merge branch 'B8091CheckBoxRequired' into 'master'

B8091 check box required

See merge request !209
parents 08437f5e 2b2e8402
Pipeline #2814 passed with stages
in 2 minutes and 55 seconds
......@@ -83,28 +83,6 @@ module.exports = function (grunt) {
}
]
},
bootstrap_validator: {
files: [
{
cwd: 'node_modules/bootstrap-validator/dist/',
src: [
'validator.min.js'
],
dest: 'js/',
expand: true,
flatten: true
},
{
cwd: 'node_modules/bootstrap-validator/dist/',
src: [
'validator.min.js'
],
dest: typo3_js,
expand: true,
flatten: true
}
]
},
jquery: {
files: [
{
......@@ -485,6 +463,10 @@ module.exports = function (grunt) {
qfqFabric: {
src: ['javascript/src/Plugins/qfq.fabric.js'],
dest: typo3_js + 'qfq.fabric.min.js'
},
qfqValidator: {
src: ['javascript/src/Plugins/validator.js'],
dest: typo3_js + 'validator.min.js'
}
},
jshint: {
......
......@@ -2059,7 +2059,6 @@ abstract class AbstractBuildForm {
if ($formElement[FE_CHECKBOX_CHECKED] === $value) {
$attribute .= Support::doAttribute('checked', 'checked');
// $valueJson = true;
$valueJson = $value;
}
......@@ -2072,7 +2071,7 @@ abstract class AbstractBuildForm {
$html .= '<input ' . $attribute . '>';
if (isset($formElement['label2'])) {
$html .= $formElement['label2'];
$html .= Support::wrapTag("<span style='font-weight: 400;'>", $formElement['label2']);
}
$labelAttribute = Support::doAttribute('title', $formElement[FE_TOOLTIP]);
......@@ -2169,7 +2168,7 @@ abstract class AbstractBuildForm {
$attributeBase .= Support::doAttribute('data-load', ($formElement[FE_DYNAMIC_UPDATE] === 'yes') ? 'data-load' : '');
$attributeBase .= $this->getAttributeList($formElement, [F_FE_DATA_PATTERN_ERROR, F_FE_DATA_REQUIRED_ERROR, F_FE_DATA_MATCH_ERROR, F_FE_DATA_ERROR]);
$key = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, 'h');
$key = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, 'h', true);
$htmlHidden = $this->buildNativeHidden($key, '');
$this->fillStoreAdditionalFormElementsCheckboxHidden($formElement, $htmlFormElementName, $htmlHidden);
......@@ -2183,13 +2182,13 @@ abstract class AbstractBuildForm {
for ($ii = 0, $jj = 1; $ii < count($itemKey); $ii++, $jj++) {
$jsonValue = false;
$classActive = '';
$htmlFormElementNameUniq = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, $ii);
$htmlFormElementNameUniq = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, $ii, true);
$attribute .= Support::doAttribute('id', $formElement[FE_HTML_ID] . '-' . $ii);
$attribute .= Support::doAttribute('name', $htmlFormElementNameUniq);
$attribute .= Support::doAttribute(ATTRIBUTE_DATA_REFERENCE, $formElement[FE_DATA_REFERENCE] . '-' . $ii);
$attribute .= Support::doAttribute('value', $itemKey[$ii]);
$attribute .= Support::doAttribute('value', $itemKey[$ii], false);
// Check if the given key is found in field.
if (false !== array_search($itemKey[$ii], $values)) {
......@@ -2244,12 +2243,12 @@ abstract class AbstractBuildForm {
$attributeBase .= Support::doAttribute('data-load', ($formElement[FE_DYNAMIC_UPDATE] === 'yes') ? 'data-load' : '');
$attributeBase .= $this->getAttributeList($formElement, [F_FE_DATA_PATTERN_ERROR, F_FE_DATA_REQUIRED_ERROR, F_FE_DATA_MATCH_ERROR, F_FE_DATA_ERROR]);
$attributeBaseLabel = Support::doAttribute('style', 'min-width: ' . $formElement[F_FE_MIN_WIDTH] . 'px;');
// 'font-weight: 400;': class 'checkbox' forces bold for the label - this is not ok.
$attributeBaseLabel = Support::doAttribute('style', 'min-width: ' . $formElement[F_FE_MIN_WIDTH] . 'px; font-weight: 400;');
$key = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, 'h');
$htmlHidden = $this->buildNativeHidden($key, '');
$this->fillStoreAdditionalFormElementsCheckboxHidden($formElement, $htmlFormElementName, $htmlHidden);
// $key = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, 'h');
// $htmlHidden = $this->buildNativeHidden($key, '');
// $this->fillStoreAdditionalFormElementsCheckboxHidden($formElement, $htmlFormElementName, $htmlHidden);
$html = '';
......@@ -2265,7 +2264,7 @@ abstract class AbstractBuildForm {
for ($ii = 0, $jj = 1; $ii < count($itemKey); $ii++, $jj++) {
$jsonValue = false;
$attribute = $attributeBase;
$htmlFormElementNameUniq = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, $ii);
$htmlFormElementNameUniq = HelperFormElement::prependFormElementNameCheckBoxMulti($htmlFormElementName, $ii, true);
$attribute .= Support::doAttribute('id', $formElement[FE_HTML_ID] . '-' . $ii);
$attribute .= Support::doAttribute('name', $htmlFormElementNameUniq);
$attribute .= Support::doAttribute(ATTRIBUTE_DATA_REFERENCE, $formElement[FE_DATA_REFERENCE] . '-' . $ii);
......@@ -2277,7 +2276,7 @@ abstract class AbstractBuildForm {
$attribute .= Support::doAttribute('autofocus', $formElement[FE_AUTOFOCUS]);
}
$attribute .= Support::doAttribute('value', $itemKey[$ii]);
$attribute .= Support::doAttribute('value', $itemKey[$ii], false);
// Check if the given key is found in field.
if (false !== array_search($itemKey[$ii], $values)) {
......@@ -2291,9 +2290,9 @@ abstract class AbstractBuildForm {
$htmlElement = '<input ' . $attribute . '>' . $value;
// With ALIGN_HORIZONTAL: the label causes some trouble: skip it
if (($orientation === ALIGN_VERTICAL)) {
$htmlElement = Support::wrapTag('<label>', $htmlElement);
}
// if (($orientation === ALIGN_VERTICAL)) {
// $htmlElement = Support::wrapTag('<label>', $htmlElement);
// }
$htmlElement = Support::wrapTag("<label class='$checkboxClass' $attributeBaseLabel>", $htmlElement, true);
......@@ -2497,7 +2496,6 @@ abstract class AbstractBuildForm {
return $this->constructRadioButton($formElement, $htmlFormElementName, $value, $json, $mode);
}
$itemKey = array();
$itemValue = array();
......@@ -2510,7 +2508,7 @@ abstract class AbstractBuildForm {
$attributeBase .= Support::doAttribute('type', $formElement[FE_TYPE]);
$attributeBase .= Support::doAttribute('data-load', ($formElement[FE_DYNAMIC_UPDATE] === 'yes') ? 'data-load' : '');
$attributeBaseLabel = Support::doAttribute('style', 'min-width: ' . $formElement[F_FE_MIN_WIDTH] . 'px;');
$attributeBaseLabel = Support::doAttribute('style', 'min-width: ' . $formElement[F_FE_MIN_WIDTH] . 'px; font-weight: 400;');
$jj = 0;
......@@ -2519,7 +2517,7 @@ abstract class AbstractBuildForm {
if ($formElement[FE_MODE] == FE_MODE_READONLY) {
$radioClass .= ' qfq-disabled';
}
$radioOuterTag = ($orientation === ALIGN_HORIZONTAL) ? "label $attributeBaseLabel" : 'div';
// $radioOuterTag = ($orientation === ALIGN_HORIZONTAL) ? "label $attributeBaseLabel" : 'label';
$br = '';
$attribute = $attributeBase;
......@@ -2544,9 +2542,9 @@ abstract class AbstractBuildForm {
$htmlElement = '<input ' . $attribute . '>' . $tmpValue;
// With ALIGN_HORIZONTAL: the label causes some trouble: skip it
if (($orientation === ALIGN_VERTICAL)) {
$htmlElement = Support::wrapTag("<label>", $htmlElement);
}
// if (($orientation === ALIGN_VERTICAL)) {
// $htmlElement = Support::wrapTag("<label>", $htmlElement);
// }
if ($formElement[FE_MAX_LENGTH] > 1) {
......@@ -2560,7 +2558,7 @@ abstract class AbstractBuildForm {
$wrapAttribute = Support::doAttribute('title', $formElement[FE_TOOLTIP]);
$wrapAttribute .= Support::doAttribute('class', $radioClass);
$htmlElement = Support::wrapTag("<$radioOuterTag $wrapAttribute>", $htmlElement) . $br;
$htmlElement = Support::wrapTag("<label $wrapAttribute $attributeBaseLabel>", $htmlElement) . $br;
$html .= $htmlElement;
......
......@@ -207,10 +207,16 @@ class HelperFormElement {
* @param string $field
* @param string $index
*
* @param bool $appendArray
* @return string
*/
public static function prependFormElementNameCheckBoxMulti($field, $index) {
return '_' . $index . '_' . $field;
public static function prependFormElementNameCheckBoxMulti($field, $index, $appendArray = false) {
// return '_' . $index . '_' . $field;
if ($appendArray) {
return $field . '[]';
}
return $field;
}
/**
......
......@@ -12,7 +12,6 @@ use IMATHUZH\Qfq\Core\Database\Database;
use IMATHUZH\Qfq\Core\Evaluate;
use IMATHUZH\Qfq\Core\Helper\HelperFormElement;
use IMATHUZH\Qfq\Core\Helper\Logger;
use IMATHUZH\Qfq\Core\Helper\Sanitize;
use IMATHUZH\Qfq\Core\Helper\Support;
......@@ -258,7 +257,7 @@ class FillStoreForm {
switch ($formElement[FE_TYPE]) {
case FE_TYPE_CHECKBOX:
// Checkbox Multi: collect values
$val = $this->collectMultiValues($clientFieldName, $clientValues);
$val = $this->collectCheckBoxValues($clientFieldName, $clientValues, $formElement[FE_CHECKBOX_CHECKED] ?? '');
if ($val !== false) {
$clientValues[$clientFieldName] = $val;
}
......@@ -280,7 +279,7 @@ class FillStoreForm {
// FORM_REST: typically form elements are filled and created on form load. This does not exist for REST Forms.
// If a FE.value is defined, this has precedence over client supplied content.
if ($formMode == FORM_REST && $formElement[FE_VALUE]!='') {
if ($formMode == FORM_REST && $formElement[FE_VALUE] != '') {
$clientValues[$clientFieldName] = $this->evaluate->parse($formElement[FE_VALUE]);
}
......@@ -353,9 +352,23 @@ class FillStoreForm {
*
* @return string
*/
private function collectMultiValues($clientFieldName, array $clientValues) {
private function collectCheckBoxValues($clientFieldName, array $clientValues, $unchecked) {
// Check for Single
// $checkboxKey = HelperFormElement::prependFormElementNameCheckBoxMulti($clientFieldName, '', false);
if (isset($clientValues[$clientFieldName])) {
if (is_array($clientValues[$clientFieldName])) {
return implode(',', $clientValues[$clientFieldName]);
}
return $clientValues[$clientFieldName];
}
return $unchecked;
$checkboxKey = HelperFormElement::prependFormElementNameCheckBoxMulti($clientFieldName, 'h');
// For templateGroups: all expanded FormElements will be tried to collect - this fails for not submitted fields.
// Therefore skip not existing clientvalues.
......
/* ========================================================================
* Bootstrap (plugin): validator.js v0.11.9
* ========================================================================
* The MIT License (MIT)
*
* Copyright (c) 2016 Cina Saffary.
* Made by @1000hz in the style of Bootstrap 3 era @fat
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
* ======================================================================== */
+function ($) {
'use strict';
// VALIDATOR CLASS DEFINITION
// ==========================
function getValue($el) {
return $el.is('[type="checkbox"]') ? $el.prop('checked') :
$el.is('[type="radio"]') ? !!$('[name="' + $el.attr('name') + '"]:checked').length :
$el.is('select[multiple]') ? ($el.val() || []).length :
$el.val()
}
var Validator = function (element, options) {
this.options = options
this.validators = $.extend({}, Validator.VALIDATORS, options.custom)
this.$element = $(element)
this.$btn = $('button[type="submit"], input[type="submit"]')
.filter('[form="' + this.$element.attr('id') + '"]')
.add(this.$element.find('input[type="submit"], button[type="submit"]'))
this.update()
this.$element.on('focusout.bs.validator', $.proxy(this.onInput, this))
this.$element.on('submit.bs.validator', $.proxy(this.onSubmit, this))
this.$element.on('reset.bs.validator', $.proxy(this.reset, this))
this.$element.find('[data-match]').each(function () {
var $this = $(this)
var target = $this.attr('data-match')
$(target).on('focusout.bs.validator', function (e) {
getValue($this) && $this.trigger('input.bs.validator')
})
})
// run validators for fields with values, but don't clobber server-side errors
this.$inputs.filter(function () {
return getValue($(this)) && !$(this).closest('.has-error').length
}).trigger('focusout')
this.$element.attr('novalidate', true) // disable automatic native validation
}
Validator.VERSION = '0.11.9'
Validator.INPUT_SELECTOR = ':input:not([type="hidden"], [type="submit"], [type="reset"], button)'
Validator.FOCUS_OFFSET = 20
Validator.DEFAULTS = {
delay: 500,
html: false,
disable: true,
focus: true,
custom: {},
errors: {
match: 'Does not match',
minlength: 'Not long enough'
},
feedback: {
success: 'glyphicon-ok',
error: 'glyphicon-remove'
}
}
Validator.VALIDATORS = {
'native': function ($el) {
var el = $el[0]
if (el.checkValidity) {
return !el.checkValidity() && !el.validity.valid && (el.validationMessage || "error!")
}
},
'match': function ($el) {
var target = $el.attr('data-match')
return $el.val() !== $(target).val() && Validator.DEFAULTS.errors.match
},
'minlength': function ($el) {
var minlength = $el.attr('data-minlength')
return $el.val().length < minlength && Validator.DEFAULTS.errors.minlength
}
}
Validator.prototype.update = function () {
var self = this
this.$inputs = this.$element.find(Validator.INPUT_SELECTOR)
.add(this.$element.find('[data-validate="true"]'))
.not(this.$element.find('[data-validate="false"]')
.each(function () { self.clearErrors($(this)) })
)
this.toggleSubmit()
return this
}
Validator.prototype.onInput = function (e) {
var self = this
var $el = $(e.target)
var deferErrors = e.type !== 'focusout'
if (!this.$inputs.is($el)) return
this.validateInput($el, deferErrors).done(function () {
self.toggleSubmit()
})
}
Validator.prototype.validateInput = function ($el, deferErrors) {
var value = getValue($el)
var prevErrors = $el.data('bs.validator.errors')
if ($el.is('[type="radio"]')) $el = this.$element.find('input[name="' + $el.attr('name') + '"]')
var e = $.Event('validate.bs.validator', {relatedTarget: $el[0]})
this.$element.trigger(e)
if (e.isDefaultPrevented()) return
var self = this
return this.runValidators($el).done(function (errors) {
$el.data('bs.validator.errors', errors)
errors.length
? deferErrors ? self.defer($el, self.showErrors) : self.showErrors($el)
: self.clearErrors($el)
if (!prevErrors || errors.toString() !== prevErrors.toString()) {
e = errors.length
? $.Event('invalid.bs.validator', {relatedTarget: $el[0], detail: errors})
: $.Event('valid.bs.validator', {relatedTarget: $el[0], detail: prevErrors})
self.$element.trigger(e)
}
self.toggleSubmit()
self.$element.trigger($.Event('validated.bs.validator', {relatedTarget: $el[0]}))
})
}
Validator.prototype.runValidators = function ($el) {
var errors = []
var deferred = $.Deferred()
$el.data('bs.validator.deferred') && $el.data('bs.validator.deferred').reject()
$el.data('bs.validator.deferred', deferred)
function getValidatorSpecificError(key) {
return $el.attr('data-' + key + '-error')
}
function getValidityStateError() {
var validity = $el[0].validity
return validity.typeMismatch ? $el.attr('data-type-error')
: validity.patternMismatch ? $el.attr('data-pattern-error')
: validity.stepMismatch ? $el.attr('data-step-error')
: validity.rangeOverflow ? $el.attr('data-max-error')
: validity.rangeUnderflow ? $el.attr('data-min-error')
: validity.valueMissing ? $el.attr('data-required-error')
: null
}
function getGenericError() {
return $el.attr('data-error')
}
function getErrorMessage(key) {
return getValidatorSpecificError(key)
|| getValidityStateError()
|| getGenericError()
}
$.each(this.validators, $.proxy(function (key, validator) {
var error = null
if ((getValue($el) || $el.attr('required')) &&
($el.attr('data-' + key) !== undefined || key == 'native') &&
(error = validator.call(this, $el))) {
if ($el.is('[type="checkbox"]')) {
if(!!$('[name="' + $el.attr('name') + '"]:checked').length) {
return true
}
}
error = getErrorMessage(key) || error
!~errors.indexOf(error) && errors.push(error)
}
}, this))
if (!errors.length && getValue($el) && $el.attr('data-remote')) {
this.defer($el, function () {
var data = {}
data[$el.attr('name')] = getValue($el)
$.get($el.attr('data-remote'), data)
.fail(function (jqXHR, textStatus, error) { errors.push(getErrorMessage('remote') || error) })
.always(function () { deferred.resolve(errors)})
})
} else deferred.resolve(errors)
return deferred.promise()
}
Validator.prototype.validate = function () {
var self = this
$.when(this.$inputs.map(function (el) {
return self.validateInput($(this), false)
})).then(function () {
self.toggleSubmit()
self.focusError()
})
return this
}
Validator.prototype.focusError = function () {
if (!this.options.focus) return
var $input = this.$element.find(".has-error :input:first")
if ($input.length === 0) return
$('html, body').animate({scrollTop: $input.offset().top - Validator.FOCUS_OFFSET}, 250)
$input.focus()
}
Validator.prototype.showErrors = function ($el) {
var method = this.options.html ? 'html' : 'text'
var errors = $el.data('bs.validator.errors')
var $group = $el.closest('.form-group')
var $block = $group.find('.help-block.with-errors')
var $feedback = $group.find('.form-control-feedback')
if (!errors.length) return
errors = $('<ul/>')
.addClass('list-unstyled')
.append($.map(errors, function (error) { return $('<li/>')[method](error) }))
$block.data('bs.validator.originalContent') === undefined && $block.data('bs.validator.originalContent', $block.html())
$block.empty().append(errors)
$group.addClass('has-error has-danger')
$group.hasClass('has-feedback')
&& $feedback.removeClass(this.options.feedback.success)
&& $feedback.addClass(this.options.feedback.error)
&& $group.removeClass('has-success')
}
Validator.prototype.clearErrors = function ($el) {
var $group = $el.closest('.form-group')
var $block = $group.find('.help-block.with-errors')
var $feedback = $group.find('.form-control-feedback')
$block.html($block.data('bs.validator.originalContent'))
$group.removeClass('has-error has-danger has-success')
$group.hasClass('has-feedback')
&& $feedback.removeClass(this.options.feedback.error)
&& $feedback.removeClass(this.options.feedback.success)
&& getValue($el)
&& $feedback.addClass(this.options.feedback.success)
&& $group.addClass('has-success')
}
Validator.prototype.hasErrors = function () {
function fieldErrors() {
return !!($(this).data('bs.validator.errors') || []).length
}
return !!this.$inputs.filter(fieldErrors).length
}
Validator.prototype.isIncomplete = function () {
function fieldIncomplete() {
var value = getValue($(this))
return !(typeof value == "string" ? $.trim(value) : value)
}
return !!this.$inputs.filter('[required]').filter(fieldIncomplete).length
}
Validator.prototype.onSubmit = function (e) {
this.validate()
if (this.isIncomplete() || this.hasErrors()) e.preventDefault()
}
Validator.prototype.toggleSubmit = function () {
if (!this.options.disable) return
this.$btn.toggleClass('disabled', this.isIncomplete() || this.hasErrors())
}
Validator.prototype.defer = function ($el, callback) {
callback = $.proxy(callback, this, $el)
if (!this.options.delay) return callback()
window.clearTimeout($el.data('bs.validator.timeout'))
$el.data('bs.validator.timeout', window.setTimeout(callback, this.options.delay))
}
Validator.prototype.reset = function () {
this.$element.find('.form-control-feedback')
.removeClass(this.options.feedback.error)
.removeClass(this.options.feedback.success)
this.$inputs
.removeData(['bs.validator.errors', 'bs.validator.deferred'])
.each(function () {
var $this = $(this)
var timeout = $this.data('bs.validator.timeout')
window.clearTimeout(timeout) && $this.removeData('bs.validator.timeout')
})
this.$element.find('.help-block.with-errors')
.each(function () {
var $this = $(this)
var originalContent = $this.da