Bootstrap-Select 无法在多个值上选择

Question

我有一个模态输入是这样的：

       <div id="position_div" class="form-group row">
                    <label for="edit_jobs" class="col-4 col-form-label">Jobs</label>
                    <div class="col-8">
                        <select id="edit_jobs" name="jobs[]" class="form-control kt-selectpicker" data-live-search="true" multiple>
                            <option value="">Select Position</option>
                        </select>
                    </div>
                </div>

和这样的脚本：

        $(document).on('click', '.edit-record', function (event) {
            event.preventDefault();
            edit_modal.modal('show');
            let edit_jobs = $("#edit_jobs");
            let url = $(this).attr('href');
            $.getJSON(url).done(function (data) {

                edit_modal.modal("show");
                let $data1 = data.date.split('-');
                let $date = $data1[2] + '/' + $data1[1] + '/' + $data1[0];

                let $data2 = data.until.split('-');
                let $until = $data2[2] + '/' + $data2[1] + '/' + $data2[0];

                let $company_id = data.company_id;
                console.log('company id:', $company_id);
                if ($company_id) {
                    $.ajax({
                        url: '/admin/interviews/position',
                        dataType: 'json',
                        type: 'POST',
                        data: {company_id: $company_id},
                        success: function (response) {
                            edit_jobs.empty(); // clear the current elements in select box
                            $.each(response, function () {
                                edit_jobs.append($('<option></option>').attr('value', this.id).text(this.title));
                            });
                            $('.kt-selectpicker').selectpicker('refresh');
                        }
                    });
                }

                let $jobs = data.jobs.split(',');

                $("#id").val(data.id);
                $("#csrf").val($csrf);
                $("#edit_user").val(data.user);
                $("#edit_venue").val(data.venue);
                $("#edit_date").val($date);
                $("#edit_until").val($until);
                $("#edit_company_id").val(data.company_id);
                $("#edit_remark").val(data.remark);

                edit_jobs.selectpicker('val', $jobs);
                edit_jobs.selectpicker('refresh');
            });
        });

我已经尝试了所有方法，但不确定为什么不能 select 编辑 select 选项。 $jobs 是一个像这样的 id 数组 [29, 30, 31, 38, 39] 那么是什么导致我无法做到 selected?

Answer 1

在你的 Ajax 中试试这个：

if ($company_id) {
                    $.ajax({
                        url: '/admin/interviews/position',
                        dataType: 'json',
                        type: 'POST',
                        data: {company_id: $company_id},
                        success: function (response) {
                            edit_jobs.empty(); // clear the current elements in select box
                            $.each(response, function () {
                                edit_jobs.append($('<option></option>').attr('value', this.id).text(this.title));
                            });

                            let result = data.jobs.split(',');
                            var $jobs = result.map(function (x) {
                                return parseInt(x, 10);
                            });

                            edit_jobs.val($jobs);
                            $('.kt-selectpicker').selectpicker('refresh');
                        }
                    });
                }

Bootstrap-Select 无法在多个值上选择

Bootrap-Select can't be selected on multiple value

jquery

jquery-plugins

bootstrap-select