Автозаполнение JQuery не работает с materialize.js - PullRequest
Новая
       22

Автозаполнение JQuery не работает с materialize.js

0 голосов
/ 26 октября 2018

Я использую Materialise, Jquery для разных вещей.Если у меня нет файла materialize.js, связанного с моей html-страницей, автозаполнение работает безупречно, но если я добавляю файл, автозаполнение перестает работать.Отладка показывает, что пропускает всю функцию.Перевод функции в режим без конфликтов также не помогает: 

    var $j = jQuery.noConflict();
    $j('#'+rowid).autocomplete({});

Кто-нибудь знает, в чем проблема?РЕДАКТИРОВАТЬ: весь код функции: "

    public AutocompleteArticles(item: OrderLine) {
    const outdatedarticle: OrderLine = item;
    let rowid = $("#txtsearch" + item.ModelId).attr('id');
    let articles: any = OrderPage.Instance().AvailableArticles;
    $('#'+rowid).autocomplete({
        source: function (request, response) {
            var searchtext = request.term.toLowerCase();
            response($.map(articles, function (item) {
                if (item.ArticleNumber.toLowerCase().includes(searchtext) || item.Name.toLowerCase().includes(searchtext) || item.Description.toLowerCase().includes(searchtext) ) {
                    return {
                        label: item.ArticleNumber + ' ' + item.Description,
                        value: {
                            ModelId: null,
                            ArticleModelId: item.ModelId,
                            OfferModelId: OrderPage.Instance().ModelId,
                            Name: item.Name,
                            Discount: item.Discount,
                            Amount: item.Amount,
                            Price: item.PriceExclVat,
                            ArticleNumber: item.ArticleNumber,
                            ArticleDescription: item.Description,
                            OrderLineDescription: item.OrderLineDescription,
                            VAT: item.TaxRate
                        }
                    }
                }
            }));

        },
        select: function (event, item) {
            let articlevalues: OrderLine = item.item.value;
            let newarticle: any = outdatedarticle;
            newarticle.ArticleModelId = articlevalues.ArticleModelId;
            newarticle.ArticleNumber = articlevalues.ArticleNumber;
            newarticle.ModelId = articlevalues.ModelId;
            newarticle.OfferModelId = articlevalues.OfferModelId;
            newarticle.Price = articlevalues.Price;
            newarticle.VAT = articlevalues.VAT;
            newarticle.Amount = outdatedarticle.Amount();
            newarticle.Discount = outdatedarticle.Discount();
            newarticle.ArticleDescription = articlevalues.ArticleDescription;

            let result: OrderLine = OrderPage.Instance().AddOrderLine(newarticle);
            OrderPage.Instance().Order.OrderLines.replace(outdatedarticle, result);
        }
    });


}

Статьи загружаются в 'AvailableArticles' на документ готов. HTML: 

    <input id="autocomplete" class="input-field autocomplete" data-bind="value: '', attr: { id: 'txtsearch' + ModelId }, event :{ keyup: OrderPage.Instance().AutocompleteArticles }" placeholder="Zoek" />

Я также использую KnockoutJS. AutocompleteArticles получаетвызвано событиями keyup.

1 Ответ

0 голосов
/ 26 октября 2018

хмм ... Я подозреваю, что вам нужно позвонить var $j = jQuery.noConflict()

До вы импортируете materialize

т.е. что-то вроде 

/* index.html */
<script src = "jquery.3.1.0.js"></script>
<script>
  var $j = jQuery.noConflict()
</script>
<script src = "materialize.1.0.0.js"></script>

/* other codes */

/* nb: $, NOT $j */
$('#'+id).autocomplete({
  /* autocomplete init obj */
})
...