Различные значения value_options в коллекции форм - PullRequest
Новая
       49

Различные значения value_options в коллекции форм

0 голосов
/ 30 октября 2019

У меня есть коллекция, в которой поле User (множественный выбор) зависит от предыдущего выбора, отдела. Поэтому каждый пользовательский выбор содержит разные «значения_опции».

Как я могу установить разные «значения_опции» при получении формы для каждой строки Коллекции?

1 Ответ

1 голос
/ 31 октября 2019

У вас есть разные опции:

  • Вы создаете конечную точку API для извлечения опций формы
  • Вы делаете это на две разные страницы: первую выбираете отдел, а вторуювыбирая пользователя (ew)
  • Вы заполняете форму на стороне сервера и фильтруете выборки на стороне клиента

Я лично не рекомендую второй вариант. Можно ли просто сказать, что это возможное решение, но NO .

Первый вариант, API, интересен, но на самом деле требует больше работы, особенно если это единственная конечная точкав вашем приложении.

Третий вариант - это тот, который я всегда использую, поскольку он требует меньше кода и довольно прост в реализации.

В вашей форме у вас есть два элемента: 

$this->add([
    'name' => 'department_id',
    'type' => 'Select',
    'attributes' => [
        'id' => 'department_id'
    ],
    'options' => [
        'value_options' => [
            1 => 'Marketing',
            2 => 'IT',
            3 => 'Logistic'
        ]
    ]
]);

$this->add([
    'name' => 'user_id',
    'type' => 'Select',
    'attributes' => [
        'id' => 'user_id',
        'multiple' => true
    ],
    'options' => [
        'value_options' => [
            [
                'value' => 1,
                'label' => 'John Doe - Marketing',
                'attributes' => ['data-department-id' => 1]
            ],
            [
                'value' => 2,
                'label' => 'Jane Doe - Marketing',
                'attributes' => ['data-department-id' => 1]
            ],
            [
                'value' => 3,
                'label' => 'Jack Doe - IT',
                'attributes' => ['data-department-id' => 2]
            ],
            [
                'value' => 4,
                'label' => 'Dana Doe - IT',
                'attributes' => ['data-department-id' => 2]
            ],
            [
                'value' => 5,
                'label' => 'Frank Doe - Logistic',
                'attributes' => ['data-department-id' => 3]
            ],
            [
                'value' => 6,
                'label' => 'Lara Doe - Logistic',
                'attributes' => ['data-department-id' => 3]
            ]
        ]
    ]
]);

Как видите, все пользователи помещены в value_options. Имейте в виду, что это всего лишь пример, вы должны использовать пользовательские элементы для заполнения такого рода выборок;)

Затем, по вашему мнению, вы визуализируете элементы: 

<?= $this->formElement($this->form->get('department_id')); ?>
<?= $this->formElement($this->form->get('user_id')); ?>

ИВы наконец добавляете код JS для обработки фильтра. Здесь я использую jQuery, но использовать его необязательно: 

$(function () {
    // Filter users when you load the page
    filterUsers(false);
    // Filter users when you change value on multiselect
    $('#department_id').on('change', function () {
        filterUsers(true);
    });
});
function filterUsers(resetValue) {
    var departmentId = $('#department_id').val();
    // Remove previous value only when filter is changed
    if (resetValue) {
        $('#user_id').val(null);
    }
    // Disable all options
    $('#user_id option').attr('disabled', 'disabled').attr('hidden', true);
    // Enable only those that respect the criteria
    $('#user_id option[data-department-id=' + departmentId + ']').attr('disabled', false).attr('hidden', false);
}

Заключительный совет : не забудьте создать и добавить в форму Validator для проверкипара department_id - user_id верна, просто чтобы (на моем примере) не принять Лара Доу (логистика) с IT отдел;)

...