How to get multiselect parameters of Form::select method in jquery?

Question

In Laravel 10 / jquery: 3.6.1 app with laravelcollective/html 6.2 library I need pass multiselect parameters to post request and having select :

<div class="flex-grow-1 w-100">
    {!! Form::select(
        'itemStatus[]',
        $itemStatusItems,
        null,
        [
            'class' => 'form-control selectpicker',
            'multiple' => true,
            'data-none-selected-text' => trans('Item Status'),
        ],
        $itemStatusSelected,
    ) !!}
</div>

I call JS function where I need to pass multiple parameters:

function showtItems() {
    // lI got error : items?d=:787 Uncaught TypeError: $(...).multiselect is not a function
    let itemStatus = $('#itemStatus').multiselect();

    $.ajax({
        url: '{{ route('getData', $point->id ) }}',
        type: 'post',
        data: {itemStatus: itemStatus},
        success: function (data) {
            ...
        }
    }).done().fail(function (data) {
        ...
    });
    point.stopPropagation();
    return false;


}

Is it a valid way to get selected items ? In the net I found some examples like that, but error in imuy case...

Answer 1

You're calling $('#itemStatus').multiselect(); but multiselect is not a built-in jQuery function.

If you intended to use the Bootstrap Multiselect plugin, you need to include it first:

 <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/js/bootstrap-multiselect.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/css/bootstrap-multiselect.css"/>

Instead of $('#itemStatus').multiselect(), use jQuery’s .val() to get selected values.