Yii2 not working jQuery script on form?

Question

JavaScript

Hello everyone, I need help! I am making a client’s work schedule, in VIEW there is a div in the form and I try to hide certain blocks using jquery: Weekends - then everything is hidden and only the save or cancel buttons remain, or vice versa when it is a working day, then working hours are selected and you can also put them from the bottom checkbox and select a break, and after clicking on the checkbox, a div block appears with a choice of time for a break.

Appearance of the working chart


Working version of the first form

the script is triggered here, the time is hidden

here the script is also triggered, when you clicked on the checkbox, the time selection for the break appears


Another form and the script


itself does not work The jquery itself

$(function () {
$('#hidden_work_time').show();
$('#type').change(function () {
    if ($('#type').val() == '2') {
        $('#hidden_work_time').hide();
    } else {
        $('#hidden_work_time').show();
    }
});

and the view itself in view

<table class="table">
<tr>
    <td>День</td>
    <td>Время работы</td>
    <td>Перерыв</td>
    <td></td>
</tr>

<?php foreach ($weeks as $k => $v) : ?>
    <?php $form = ActiveForm::begin(); ?>
    <tr>
        <td><?= $v ?></td>
        <td>
            <?php foreach ($workGraph as $item): ?>
                <?= $item->week == $v ? $item->work_start . ' - ' . $item->work_end : false; ?>
            <?php endforeach; ?>
        </td>
        <td>
            <?php foreach ($workGraph as $item): ?>
                <?= $item->week == $v ? $item->break_start . ' - ' . $item->break_end : false ?>
            <?php endforeach; ?>
        </td>
        <td>
            <?php Modal::begin([
                'size' => 'modal-sm',
                'toggleButton' => [
                    //'tag' => 'a',
                    'label' => 'Редактировать',
                    //'href' => '#lfake_id',
                    //'data-target' => '#lfake_id'
                ],
            ]);
            ?>
            <div class="col-md-12">
                <?= $form->field($model, 'status_week')->dropDownList(Profile::$days, ['id' => 'type'])->label(false); ?>
            </div>
            <div id="hidden_work_time">
                <div class="col-md-6">
                    <?= $form->field($model, '[$k]work_start')->widget(TimePicker::classname(),
                        [
                            'value' => '00:00',
                            'pluginOptions' => [
                                'showMeridian' => false,
                            ]
                        ])->label('');
                    ?>
                </div>
                <div class="col-md-6">
                    <?= $form->field($model, "[$k]work_end")->widget(TimePicker::classname(),
                        [
                            'value' => '00:00',
                            'pluginOptions' => [
                                'showMeridian' => false,
                            ]
                        ])->label('');
                    ?>
                </div>
                <div class="col-md-12">
                    <?= $form->field($model, '[$k]has_break')->checkbox(['onchange' => 'showBreakTime(this.checked)']) ?>
                </div>
                <div id="hidden_break_time" style="display: none">
                    <div class="col-md-6">
                        <?= $form->field($model, "break_start")->widget(TimePicker::classname(),
                            [
                                'value' => '00:00',
                                'pluginOptions' => [
                                    'showMeridian' => false,
                                ]
                            ])->label('');
                        ?>
                    </div>
                    <div class="col-md-6">
                        <?= $form->field($model, "[$k]break_end")->widget(TimePicker::classname(),
                            [
                                'value' => '00:00',
                                'pluginOptions' => [
                                    'showMeridian' => false,
                                ]
                            ])->label('');
                        ?>
                    </div>
                </div>
            </div>
            <div class="clear"></div>
            <?= Html::submitButton('Сохранить', ['class' => 'btn btn-success']); ?>
            <?= Html::submitButton('Отмена', ['class' => 'btn btn-danger', 'data-dismiss' => 'modal', 'aria-hidden' => 'true']); ?>
            <?php Modal::end(); ?>
        </td>
    </tr>
    <?php $form = ActiveForm::end() ?>
<?php endforeach; ?>

And another question is the days of the week, I decompose foreach, and it turns out that for each day there is a time and a break field($model, '[$k]work_start'), but I can’t figure out how to get the array itself to save it to the database [$k]work_start - Mon|09:00, I accept in the controller and the updateProfile itself occurs in the model.

The database itself

'id' => 1,
'week' => 'Mon',
'start_time' => '08.00',
'end_time' => '17.00',
'break_start' => '12.00',
'break_start' => '13.00',
is_weekend' => false,

Thanks in advance!

Answer 1

id must be unique, bind to classes

Answer 2

js

$('.trigger').click(function() {
$('.hidden_work_time').toggle(); });

the input itself to the form-control class so that the styles do not fly off

<?= $form->field($model, 'status_week')->dropDownList(Profile::$days, ['class' => 'form-control trigger'])->label(false); ?>