Я пытаюсь использовать javascript для отображения или скрытия раздела формы CakePHP на основе значения флажка.
Я расширяю существующую форму CakePHP, в которой эта функциональность уже работает, для одного раздела формы и добавляю в форму другой раздел, который нуждается в аналогичной функциональности. Я новичок в программировании на javascript и, глядя на существующий код, мне неясно, какое соглашение об именах используется для доступа к значениям полей формы CakePHP.
Вот код, который уже работает для отображения или скрытия раздела формы:
Код представления CakePHP, который создает форму:
echo $this->Form->create('Book', array('type' => 'file', 'id' => 'BookForm'));
echo $this->Form->input('is_part_of_series', array(
'label' => __('Part of Series', true),
'type' => 'checkbox',
'id' => 'partOfSeries'));
echo '<div class="series">';
echo $this->Form->input('series_title', array(
'label' => __('Series Name', true)));
echo $this->Form->input('series_sequence', array(
'label' => __('Series Sequence', true)));
echo '</div>';
echo $this->Form->submit('Submit', array('class' => 'dark button inline', 'div' => false));
echo $this->Form->end();
Javascript-код, который отображает или скрывает «серии» div:
App.booksAdd = {
init: function () {
var self = this;
if ($('#BookSeriesTitle').val() != "" || $('#BookSeriesSequence').val() != "") {
$('#partOfSeries').attr('checked', "checked");
}
this.hideSeries();
$('#partOfSeries').click(function() {
self.hideSeries();
});
hideSeries: function () {
if ($('#partOfSeries').attr('checked')) {
$('div.series').show();
} else {
$('div.series').hide();
}
}
}
Этот код инициализирует проверенный статус в зависимости от того, являются ли заголовок серии и значения последовательности серий пустыми. Я не понимаю, как имена переменных #BookSeriesTitle и #BookSeriesSequence получены из имен series_title и series_sequence в форме CakePHP. Я искал весь код для этих имен, но в коде нет других экземпляров этих имен.
Это дополнительный код, который я добавляю:
Код представления CakePHP, который создает форму:
$hasAReleaseDate = empty($book['Book']['sales_start']) ? '0' : '1';
echo $this->Form->input('has_release_date', array(
'label' => __('Specify release date', true),
'type' => 'checkbox',
'checked' => $hasAReleaseDate,
'id' => 'hasReleaseDate'));
echo '<div class="releasedate">';
echo $this->Form->input('sales_start', array(
'label' => __('Release Date', true),
'dateFormat' => 'YMD',
'minYear' => '1980',
'maxYear' => date('Y') + 1,
'type' => 'date'));
echo '</div>;
Новый код javascript, который отображает или скрывает раздел «освобожденный»:
if (document.getElementById("hasReleaseDate").val() == "1") {
$('#hasReleaseDate').attr('checked', "checked");
}
this.hideReleaseDate();
$('#hasReleaseDate').click(function() {
self.hideReleaseDate();
});
hideReleaseDate: function () {
if ($('#hasReleaseDate').attr('checked')) {
$('div.releasedate').show();
} else {
$('div.releasedate').hide();
}
}
Новый флажок функционирует правильно, чтобы скрывать и показывать «освобожденный» div каждый раз, когда я нажимаю на флажок. Однако при первоначальном отображении страницы раздел не отображается должным образом или не скрывается в зависимости от начального значения данных.
Я считаю, что проблема в линии:
if (document.getElementById("hasReleaseDate").val() == "1") {
потому что он неправильно ссылается на начальное состояние поля флажка hasReleaseDate.
Предыдущий код, который реализует раздел series, не инициализировал состояние переменной javascript checked #partOfSeries с использованием поля флажка формы, но вместо этого проверил значения двух полей, которые отображаются, когда флажок установлен.
Для нового кода это не будет работать, потому что CakePHP по умолчанию устанавливает поле даты в сегодняшнюю дату, если оно не было предварительно установлено, поэтому оно всегда имеет непустое значение. Для нового кода мне нужен javascript для инициализации его проверенного статуса на основе проверенного статуса поля hasReleaseDate формы.
Я экспериментировал, пытаясь использовать аналогичную ссылку на данные формы "#BookHasReleaseDate", как это делает выходной код, но, поскольку он не работал, и я не понимаю, как работает именование, я затем переключился на то, что казалось Более распространенное именование в примерах кода я нашел "document.getElementById (" hasReleaseDate ")". Я не мог заставить его работать в любом случае, и я не смог определить, является ли моя проблема проблемой правильной ссылки на флажок формы, или проблемой с логикой, которая пытается сравнить, если проверенное значение равно '1'.
Если кто-то понимает, как соглашение об именах #BookSeriesTitle ссылается на поле series_title формы CakePHP, я был бы признателен за изучение того, как это работает, а также за помощь в кодировании правильного способа ссылки на новое поле hasReleaseDate для инициализации проверенного состояния javascript $. Переменная hasReleaseDate.