Skip to content

Referencing VS initialized object, no properties work. #458

@Romans96

Description

@Romans96

Hello! I'm using a separate file to init the virtual select in this way:

export function initBaseVirtualSelects(selects) {
    selects.forEach(el => {
        VirtualSelect.init({
            ele: `#${el.id}`,
            disabled: el.disabled ? el.disabled : false,
            multiple: el.multiple ? el.multiple : false,
            ...
            options: (el.options[0] !== undefined && el.options[0]["label"] !== undefined) ? el.options : el.options.map(item => {
                return {
                    label: item,
                    value: item
                };
            }),
    })
}

And init my select in this way:

initBaseVirtualSelects([{
    id: "mySelect",
    label: "mySelect",
       
    onServerSearch: (searchValue, vs) => mySearchFunc(searchValue, vs),
}

Then i use in change method in an other file:

const mySelect = document.querySelector("mySelect");
mySelect.addEventListener('change', async function () {
    const selectedValue = mySelect.value;
    console.log(mySelect.getSelectedOptions())
    mySelect.disable()

Now way the .value work (it's DOM), but .getSelectedOptions() returns undefined and .disable() do nothing?

The virtual select is initialized, the select work and also the serverSearch:

<div class="filter-item-input virtual-select vscomp-ele pop-comp-ele pop-comp-active" id="mySelect" name="mySelect">
    <div id="vscomp-ele-wrapper-404" class="vscomp-ele-wrapper vscomp-wrapper has-clear-button has-search-input popup-position-center focused" tabindex="0" role="combobox" aria-haspopup="listbox" aria-controls="vscomp-dropbox-container-404" aria-expanded="false" aria-label="Options list" aria-activedescendant="">
        <input type="hidden" name="mySelect" class="vscomp-hidden-input" value="">

        <div class="vscomp-toggle-button">
        ...
    </div>
</div>
Image

Sometimes i need to click the option 2 times, in order that che change works and take the value.
Like the first click did not "select nothing" so it's empty and the VS methods won't work, then they work

What i'm doing wrong? Or what i left?

Thank you

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions