Выбор первого элемента, если начальное значение не существует

Здесь у нас есть поле со списком:

@(Html.Kendo().ComboBox()
    .Name("depots")
    .DataTextField("Text")
    .DataValueField("Value")
    .Height(500)
    .Filter(FilterType.Contains)
    .Events(ev =>
    {
        ev.Change("onDepotsChangeEvent");
        ev.DataBound("onDepotsDataBoundEvent");
        ev.Select("onDepotsSelectEvent");
    })
    .HighlightFirst(true)
    .Suggest(true)
    .Value(SOME INITIAL VALUE)
    .HtmlAttributes(new { style = "width:550px; max-width:100%;" })
    .DataSource(source => source.Custom()
        .Group(group => group.Add("Group", typeof(string)))
        .Transport(transport => transport
            .Read(read =>
            {
                // Censored ;)
            })
        )
    )
)

Как видите, я устанавливаю начальное значение с помощью «.Value(что-то что-то». Это означает, что при загрузке поля со списком выбирается элемент в списке, соответствующий значению. Он работает нормально, как и предполагалось.

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

Что я хочу сделать, так это то, что если в поле со списком не существует элемента с тем же значением, что и начальное установленное значение, следует выбрать первый элемент в списке.

Я искал и искал в течение нескольких дней, без решения, поэтому любая помощь будет принята с благодарностью.

Если это имеет значение, вот три метода событий:

function onDepotsSelectEvent(e) {
    if (e.item) {
        var dataItem = this.dataItem(e.item.index());
        $.post("@Url.Action("SetSelectedDepotSession", "PartialView")", { id: dataItem.Value });
    }
}

function onDepotsChangeEvent(e)
{
    if (this.value() && this.selectedIndex === -1) {
        this._filterSource({
            value: "",
            field: this.options.dataTextField,
            operator: "contains"
        });
        this.select(1);
    }
}

function onDepotsDataBoundEvent(e)
{
    var widget = e.sender;

    if (widget.dataSource.view().length === 0) {
        widget.text("");
        widget.enable(false);
    }
}

РЕШЕНИЕ

Вот код события с привязкой к данным с исправлением:

function onDepotsDataBoundEvent(e)
{
    var widget = e.sender;

    if (widget.dataSource.view().length === 0) {
        widget.text("");
        widget.enable(false);
    }

    if (widget.select() === -1) {
        widget.select(0);
    }
}

Что он делает, так это то, что сначала, если элементов нет вообще, поле со списком отключено. Затем, если начальное значение не существует в списке, вместо него выбирается первый элемент в списке.


person Frederik T    schedule 20.04.2018    source источник


Ответы (1)


Хотя да, это странное поведение. Это похоже на то, что виджет добавит недопустимое значение в свой список. Я проверил, что если вы сделаете .val() непосредственно в элементе ввода или .value() в экземпляре виджета, вы получите недопустимое значение, но если вы сделаете .select(), он вернет -1, так как нет никакого DataItem, связанного с этим значением. Это начало.

Что работает для меня, так это очистить значение виджета в событии dataBound, если .select() возвращает -1. Что-то типа:

if (this.select() == -1) {
    this.value(null);
}

Демо

person DontVoteMeDown    schedule 20.04.2018
comment
Ах! Это сделало трюк! Я был уверен, что решение было чем-то незначительным, что я упустил из виду. Мне нужно провести еще несколько тестов, в том числе с разными браузерами, так как кендо ведет себя по-разному, например, в Edge и Firefox (ну, по крайней мере, в той версии, которую я использую). Я использовал ваш фрагмент кода, но добавил выбор, чтобы выбрать первый элемент в списке. Я обновил свой OP с решением. - person Frederik T; 20.04.2018
comment
@FrederikT приятно это слышать! Развитие кендо — это все о мелочах и трюках, ха-ха. - person DontVoteMeDown; 20.04.2018
comment
Да расскажи мне об этом. Действительно источник многих головных болей. При всем том, что они делают хорошо, у них равное количество спагетти-кода и отсутствие документации. - person Frederik T; 20.04.2018