Parent - Child Select варианты - PullRequest
0 голосов
/ 01 ноября 2019

Мой текущий код работает нормально после загрузки страницы. Когда пользователь изменяет родительский выбор (sel_center), он обновляет дочерний выбор (sel_office).

Выпуск # 1

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

Issue # 2

Когда определенные пользователи вошли в систему, они могут видеть только свой собственный центр в select (sel_center) select (Working), но дочерний select не будет обновляться до родительского параметра по умолчанию, посколькучасти .change кода jQuery, и у меня недостаточно опыта работы с jQuery, чтобы обновить его, чтобы он работал в обоих направлениях.

ВЫБОР РОДИТЕЛЯ:

<select name="sel_center" id="sel_center" class="form-control selectpicker" data-live-search="true"
                                data-container="body" data-size="15" title=" Center" data-dropup-auto="false" required>
                            <cfif isUserInRole("Admin")>
                                <option value="-1" <cfif form.sel_center EQ "-1">SELECTED</cfif>>All Centers/Offices</option>
                            <cfelse>
                                <option value="" <cfif form.sel_center EQ "">SELECTED</cfif>>Select . . . . .</option>
                            </cfif>
                            <cfloop query="rtn_getActiveCenters">
                                <cfoutput>
                                    <option <cfif form.sel_center EQ rtn_getActiveCenters.Center_ID>SELECTED</cfif> value="#rtn_getActiveCenters.Center_ID#">#rtn_getActiveCenters.Center_Acronym# - #rtn_getActiveCenters.Center_Name# (#rtn_getActiveCenters.admin_code#)</option>
                                </cfoutput>
                            </cfloop>
                        </select>

ВЫБОР РЕБЕНКА:

<select name="sel_office" id="sel_office" class="form-control selectpicker" data-live-search="true" data-container="body" data-size="15" title="Sub-Office" data-dropup-auto="false">
    <option value="0" <cfif form.sel_office EQ "-1">SELECTED</cfif>>All Sub-Offices</option>
    <cfloop query="rtn_getAllOffices">
    <cfoutput>
    <option data-option="#rtn_getAllOffices.Center_ID#" <cfif form.sel_office EQ rtn_getAllOffices.Office_ID>SELECTED</cfif> value="#rtn_getAllOffices.Office_ID#">#rtn_getAllOffices.Office_Name# (#rtn_getAllOffices.office_admin_code#)</option>
    </cfoutput>
    </cfloop>
    </select>

ФУНКЦИЯ jQUERY:

<script>
        $("#sel_center").change(function () {
        if (typeof $(this).data('options') === "undefined") {
            /*Taking an array of all options-2 and kind of embedding it on the select1*/
            $(this).data('options', $('#sel_office option').clone());
            }
            var id = $(this).val();
            var options = $(this).data('options').filter('[data-option=' + id + ']');
                $('#sel_office').html(options);
                $('#sel_office').selectpicker('refresh');
        });
    </script>

1) Мне нужна опция «ВСЕ центры», когда она выбрана, чтобы показать все выбранные дочерние офисы. 2) Мне нужен дочерний элемент select для фильтрации при загрузке страницы, когда выбран центр по умолчанию.

...