I have an another problem in my form in the administrator side of the website. I have a custom component, in which there is a form. When I click on Save or Save and close, or even the little arrow next to Save and close, I have those error :
For clicking on "Save" and "Save and close" : cannot read properties of undefined (reading isValid())
For clicking on the little arrow : cannot read properties of null (reading 'classlist')
Here is the code that show's up in the dev tool for these error :
For isValid() (in core.js):
if (!newValidate || document.formvalidator.isValid(form)) {
Joomla.submitform(task, form);
}
For classlist (in dropdown.js) :
_isShown() {
return this._menu.classList.contains(CLASS_NAME_SHOW);
}
I don't really know which code could be interesting between the controller, the model and the view. I will give you the view, because it's the most interesting code I think :
<?php
// No direct access to this file
use Joomla\CMS\HTML\HTMLHelper;
use Joomla\CMS\Language\Text;
use Joomla\CMS\Router\Route;
use Joomla\CMS\Factory;
defined('_JEXEC') or die('Restricted access');
HtmlHelper::_('behavior.tooltip');
HtmlHelper::_('behavior.formvalidator');
HtmlHelper::_('formbehavior.chosen', 'select');
HtmlHelper::_('behavior.keepalive');
?>
<link rel="stylesheet" href="components/com_skydivespa/assets/addons/timepicker/css/bootstrap-timepicker.min.css">
<script src="components/com_skydivespa/assets/addons/timepicker/js/bootstrap-timepicker.min.js"></script>
<script src="media/system/js/fields/validate.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
//get url's params
var URL = {};
document.location.search.replace(/\??(?:([^=]+)=([^&]*)&?)/g, function () {
function decode(s) {
return decodeURIComponent(s.split("+").join(" "));
}
URL[decode(arguments[1])] = decode(arguments[2]);
});
//creation datpicker
jQuery('<span class="add-on"><i class="icon-clock"></i></span>').insertAfter('#jform_heure_in');
jQuery('#jform_heure_in').timepicker({
minuteStep: 15,
secondeStep: 30,
template: 'dropdown',
showSeconds: false,
showMeridian: false
});
jQuery('<span class="add-on"><i class="icon-clock"></i></span>').insertAfter('#jform_heure_out');
jQuery('#jform_heure_out').timepicker({
minuteStep: 15,
secondeStep: 30,
template: 'dropdown',
showSeconds: false,
showMeridian: false
});
});
</script>
<style type="text/css" media="screen">
#tab1 .control-group .controls, #tab2 .control-group .controls, #tab3 .control-group .controls, #tab4 .control-group .controls, #tab5 .control-group .controls {
margin-left: 0;
}
#tab5 .control-group .control-label{
width: auto;
}
</style>
<form action="<?php echo Route::_('index.php?option=com_skydivespa&layout=edit&id='.(int) $this->item->id); ?>" method="post" name="adminForm" id="adminForm" class="form-validate" enctype="multipart/form-data">
<div class="row">
<div class="col-lg-6 form-horizontal">
<fieldset class="adminForm">
<legend><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_TITLE_FORM' ); ?></legend>
<div class="adminFormList">
<?php foreach ($this->form->getFieldset('params') as $field) : ?>
<div class="control-group">
<div class="control-label">
<?php echo $field->label; ?>
</div>
<div class="controls">
<?php if($field->name == 'jform[heure_in]' || $field->name == 'jform[heure_out]') echo '<div class="input-append bootstrap-timepicker">'; ?>
<?php echo $field->input; ?>
<?php if($field->name == 'jform[heure_in]' || $field->name == 'jform[heure_out]') echo '</div>'; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</fieldset>
<fieldset class="adminForm">
<legend><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_TITLE_INFOS' ); ?></legend>
<div class="adminFormList">
<?php foreach ($this->form->getFieldset('infos') as $field) : ?>
<div class="control-group">
<div class="control-label">
<?php echo $field->label; ?>
</div>
<div class="controls">
<?php echo $field->input; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</fieldset>
</div>
<div class="col-lg-6 form-horizontal pull-right">
<ul class="nav nav-tabs">
<li class="nav-item"><a class="nav-link active" href="#tab1" data-bs-toggle="tab"><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_LANGUAGES_FR' ); ?></a></li>
<li class="nav-item"><a class="nav-link" href="#tab2" data-bs-toggle="tab"><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_LANGUAGES_EN' ); ?></a></li>
<li class="nav-item"><a class="nav-link" href="#tab3" data-bs-toggle="tab"><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_LANGUAGES_NL' ); ?></a></li>
<li class="nav-item"><a class="nav-link" href="#tab4" data-bs-toggle="tab"><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_LANGUAGES_DE' ); ?></a></li>
<li class="nav-item"><a class="nav-link" href="#tab5" data-bs-toggle="tab"><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_RESPONSE' ); ?></a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab1">
<fieldset class="adminForm">
<legend><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_TITLE_DESC_FR' ); ?></legend>
<div class="adminFormList">
<?php foreach ($this->form->getFieldset('descriptions_fr') as $field) : ?>
<div class="control-group">
<div class="control-label">
<?php echo $field->label; ?>
</div>
<div class="controls">
<?php echo $field->input; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</fieldset>
</div>
<div class="tab-pane" id="tab2">
<fieldset class="adminForm">
<legend><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_TITLE_DESC_EN' ); ?></legend>
<div class="adminFormList">
<?php foreach ($this->form->getFieldset('descriptions_en') as $field) : ?>
<div class="control-group">
<div class="control-label">
<?php echo $field->label; ?>
</div>
<div class="controls">
<?php echo $field->input; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</fieldset>
</div>
<div class="tab-pane" id="tab3">
<fieldset class="adminForm">
<legend><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_TITLE_DESC_NL' ); ?></legend>
<div class="adminFormList">
<?php foreach ($this->form->getFieldset('descriptions_nl') as $field) : ?>
<div class="control-group">
<div class="control-label">
<?php echo $field->label; ?>
</div>
<div class="controls">
<?php echo $field->input; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</fieldset>
</div>
<div class="tab-pane" id="tab4">
<fieldset class="adminForm">
<legend><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_TITLE_DESC_DE' ); ?></legend>
<div class="adminFormList">
<?php foreach ($this->form->getFieldset('descriptions_de') as $field) : ?>
<div class="control-group">
<div class="control-label">
<?php echo $field->label; ?>
</div>
<div class="controls">
<?php echo $field->input; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</fieldset>
</div>
<div class="tab-pane" id="tab5">
<fieldset class="adminForm">
<legend><?php echo Text::_( 'BACK_COM_SKYDIVESPA_FORMATION_RESPONSE_DESC' ); ?></legend>
<div class="accordion" id="accordion2" >
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne" style="background: #a94442;font-weight: 600;color: #ffffff">
Utilisation paramètres pour les réponses aux inscrits <small>(cliquer pour ouvrir / fermer)</small>
</a>
</div>
<div id="collapseOne" class="accordion-body collapse">
<div class="accordion-inner">
<div class="row">
<div class="col-lg-6">
<dl>
<dt>%1$s</dt>
<dd>type de formation</dd>
<dt>%2$s</dt>
<dd>titre de formation</dd>
<dt>%3$s</dt>
<dd>descprition de formation</dd>
<dt>%4$s</dt>
<dd>date de début de formation</dd>
<dt>%5$s</dt>
<dd>nombre de jour de formation</dd>
<dt>%6$s</dt>
<dd>heure de début de formation</dd>
<dt>%7$s</dt>
<dd>heure de fin de formation</dd>
<dt>%8$s</dt>
<dd>nombre maximum</dd>
<dt>%9$s</dt>
<dd>langue de la formation</dd>
</dl>
</div>
<div class="col-lg-6">
<dl>
<dt>%10$s</dt>
<dd>prénom</dd>
<dt>%11$s</dt>
<dd>nom</dd>
<dt>%12$s</dt>
<dd>sexe</dd>
<dt>%13$s</dt>
<dd>date de naissance</dd>
<dt>%14$s</dt>
<dd>poids</dd>
<dt>%15$s</dt>
<dd>langue</dd>
<dt>%16$s</dt>
<dd>adresse</dd>
<dt>%17$s</dt>
<dd>code postal</dd>
<dt>%18$s</dt>
<dd>ville</dd>
<dt>%19$s</dt>
<dd>pays</dd>
<dt>%20$s</dt>
<dd>email</dd>
<dt>%21$s</dt>
<dd>tél. / gsm</dd>
<dt>%22$s</dt>
<dd>pers. de contact</dd>
<dt>%23$s</dt>
<dd>tel. pers. de contact</dd>
<dt>%24$s</dt>
<dd>Référence de l'inscription</dd>
</dl>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="adminFormList">
<?php foreach ($this->form->getFieldset('response_register') as $field) : ?>
<div class="control-group">
<div class="control-label">
<?php echo $field->label; ?>
</div>
<div class="controls">
<?php echo $field->input; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div>
<input type="hidden" name="task" value="" />
<?php echo HtmlHelper::_('form.token'); ?>
</div>
</form>
Do someone have a hint on why I have this error please ?
I checked the core.js and dropdown.js. I used a console.log(document.isValid()) but it return undefined. I also checked if HTMLHelper is correctly set up, and if there is an error on the save, save&new function in the controller and model