Выбор сеанса конференции с помощью эксклюзивности формы с помощью переключателя или jquery

#php #jquery #html #laravel #forms

#php #jquery #HTML #laravel #формы

Вопрос:

Мое приложение позволяет организациям создавать события, которые имеют сеансы в нескольких дорожках. Эти дорожки не обязательно должны быть симметричными на 100% (см. Пример изображения ниже).

Мне нужно сделать так, чтобы один сеанс, который может перекрывать несколько сеансов, имел бы отношения взаимной исключительности-выбора.

пример формы

В этом примере, если владелец регистрации выбирает сеанс семинара (с 1 до 5 вечера), в настоящее время форма запрещает выбор сеансов с 1-2:30 вечера.

Я добился этого, просто указав имя переключателя для тех 3 сеансов, которые начинаются в 1 час дня, все имеют одно и то же имя.

В идеале, это также должно предотвращать выбор сеансов с 3-4:30 вечера.

Я не могу использовать одно и то же решение (если сеансы, начинающиеся в 3 часа дня, имеют одно и то же имя), потому что тогда это помешало бы владельцам регистраций посещать сеанс в 1 час дня, а другой — в 3 часа дня (без выбора семинара с 1 до 5 вечера).

Соответствующие поля моей таблицы сеансов следующие:

 sessionID int
trackID int
eventID int
sessionName varchar
confDay int
start datetime
end   datetime
order int
  

Как я могу достичь желаемого результата без огромного количества кода?

Код для отображения этой формы можно увидеть на jsfiddle.net .

Ответ №1:

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

Я приветствую альтернативные подходы. Надеюсь, это поможет кому-то еще.

Я называю настройку сеанса выше «асимметричной», потому что не все треки имеют одинаковое количество сеансов с одинаковым временем.

Соответствующие столбцы в таблице сеансов перечислены в исходном вопросе. Чтобы включить это решение, было добавлено следующее поле:

 isLinked int
  

Примечание1: isLinked — это либо 0, либо идентификатор сеанса неудаленного сеанса, который должен отображаться в списке сеансов с переключателем.

Примечание 2: isLinked устанавливается для удаленных и не удаленных сеансов, которые «перекрываются».

У меня есть цикл, который циклически повторяет conference_days, затем треки, затем сеансы (по порядку, до 5 в день). Пользовательский интерфейс настройки событий позволяет пользователю программно удалять сеансы, которые не имеют отношения к делу.

В этом пользовательском интерфейсе пользователь также указывает, будет ли сеанс перекрывать другие сеансы, и, если да, позволяет пользователю устанавливать это поле для удаленных сеансов в том же треке.

Пользовательский интерфейс для выбора сеанса затем облегчается следующим псевдокодом для генерации html и javascript для эмуляции желаемого поведения:

 foreach($conference_days as $day){

    foreach($tracks as $track){

        for($so=1;$so<=5;$so  ){
        // $so = session_order

            grab the session for the current $day, track ID, and $so

            if(not soft-deleted amp;amp; !isLinked) {  // isLinked == 0
                display as normal with all details   radio button

            } elseif(not soft-deleted amp;amp; isLinked) {
                display as normal with all details   radio button
                also add javascript that when above radio button is selected
                    a variable* number of to-be-created, hidden, radio buttons 
                    (below) are also selected; 
                    *count the isLinked sessions with same ID that are soft-deleted

            } else {
                display nothing, but...
                output a radio button with style.visiblity=hidden named in a 
                    predictable way based on $day, $track, and $so
                add javascript that to monitor changes to the radio selection in 
                this row so it auto-deselects the visible radio button above.
            }
        }
     }
 }