Как передать View Param для просмотра Model DataSource в Kendo Mobile?

Как правильно передать переменную представления из URL-адреса в модель представления, чтобы отфильтровать результат?

Например:

dataSource: new kendo.DataSource( { 
    transport: {
        read: {
           url: 'http://api.endpoint.com/resource',
        }
        parameterMap: function(options,type) {
            if (type === 'read') {
                return {
                   FormID: view.params.FormID
                };
            }
        }

});

В приведенном выше примере в URL-адресе есть параметр с именем «FormID», и я хотел бы передать это значение прямо в функцию parameterMap. Объекта «представление» нет, поэтому я просто привожу это в качестве примера.

Я попытался подключиться к функциям «data-show» и «data-init», чтобы установить это значение для использования, но источник данных извлекает данные до запуска этих функций.

Спасибо


person AndreLiem    schedule 12.02.2014    source источник
comment
Здесь есть прогресс? Я хочу сделать то же самое, но предпочел бы просто добавить его в конец URL-адреса, чтобы это было что-то вроде «api.endpoint.com/resource/123'   -  person 2GDave    schedule 25.04.2014
comment
@2GDave звучит так, будто вы хотите сделать функцию transport.read, чтобы вы могли составить URL-адрес; Я не понимаю, откуда должно браться значение, добавляемое к URL-адресу.   -  person Lars Höppner    schedule 25.04.2014
comment
Правильно, я хочу использовать переменную для создания URL-адреса конечной точки API, а затем установить источник данных для возвращаемых данных. Значение будет передано из исходного списка. В этом случае у меня есть список RSS-каналов, и когда вы нажимаете на канал, он загружает элементы канала для этого канала.   -  person 2GDave    schedule 27.04.2014
comment
Вот шаблон списка фидов: ‹div id=feedsView data-role=view data-title=PNR Feeds data-model=app.pnrfeedsService.viewModel› ‹ul data-role=listview data-style=inset data-bind =источник: pnrfeedsDataSource data-template=pnr-feeds-template›‹/ul› ‹/div› ‹script id=pnr-feeds-template type=text/x-kendo-tmpl› ‹div class=w-item-template › ‹a href=feeditemsView?FeedID=${FeedID} data-role=listview-link›‹h4 class=w-date›${FeedName}‹/h4›‹/a› ‹/div› ‹/script›   -  person 2GDave    schedule 27.04.2014


Ответы (2)


Параметр конфигурации options.transport.read может быть функцией, поэтому вы можете составить URL-адрес там:

dataSource: new kendo.DataSource({
    transport: {
        read: function (options) {
            // get the id from wherever it is stored (e.g. your list view)
            var resourceId = getResourceId(); 

            $.ajax({
                url: 'http://api.endpoint.com/resource/' + resourceId,
                dataType: "jsonp",
                success: function (result) {
                    options.success(result);
                },
                error: function (result) {
                    options.error(result);
                }
            });
        }
    }
});

Чтобы связать это с представлением списка, вы можете использовать событие change списка. :

data-bind="source: pnrfeedsDataSource, events: { change: onListViewChange }"

затем в viewModel.onListViewChange вы можете установить соответствующий идентификатор ресурса для элемента, на который нажали:

// the view model you bind the list view to
var viewModel = kendo.observable({
    // ..., your other properties
    onListViewChange: function (e) {
        var element = e.sender.select(); // clicked list element
        var uid = $(element).data("uid");
        var dataItem = this.dataSource.getByUid(uid);

        // assuming your data item in the data source has the id 
        // in dataItem.ResourceId
        this._selectedResource = dataItem.ResourceId; 
    }
});

Тогда getResourceId() может получить его от viewModel._selectedResource (или это может быть геттер самой модели представления). Я не уверен, как все это устроено в вашем коде, поэтому сложно дать больше советов; возможно, вы могли бы добавить ссылку на jsfiddle для иллюстрации.

person Lars Höppner    schedule 28.04.2014
comment
Так как же будет выглядеть getResourceId()? Будет ли эта функция иметь доступ к представлению, чтобы я мог получить параметры представления? Я думаю, это то, что я ищу, но теперь я не уверен, что в эту функцию будет добавлен идентификатор ресурса. есть идеи? - person 2GDave; 28.04.2014
comment
см. редактирование (если это не сработает, было бы полезно узнать больше о том, как это структурировано, например, как DS связан с моделью представления) - person Lars Höppner; 28.04.2014
comment
Спасибо, я новичок в кендо и мобильном пользовательском интерфейсе, поэтому помощь очень ценится. Я попробую и дам вам знать, как это происходит. - person 2GDave; 28.04.2014
comment
Как я уже сказал в комментарии ниже, еще раз спасибо вам обоим за усилия! Я установил его и работает, и теперь я иду к jaydata, чтобы немного позаботиться об этом. - person 2GDave; 29.04.2014

Для этой цели вы можете использовать «глобальную» переменную или поле в модели представления. Что-то вроде

var vm = kendo.observable({
   FormID: null, 
   dataSource: new kendo.DataSource( { 
   transport: {
    read: {
       url: 'http://api.endpoint.com/resource',
    }
    parameterMap: function(options,type) {
        if (type === 'read') {
            return {
               FormID: vm.FormID
            };
        }
    }
  })
});

function viewShow(e) {
    vm.set("FormID", e.view.params.FormID);
    // at this point it is usually a good idea to invoke the datasource read() method.
    vm.dataSource.read();
}

Источник данных будет извлекать данные до события представления представления, если к нему привязан виджет. Вы можете обойти эту проблему, установив для параметра конфигурации виджета autoBind значение false — все виджеты пользовательского интерфейса Kendo с привязкой к данным поддерживают его.

person Petyo Ivanov    schedule 27.04.2014
comment
Как в этом примере ресурс узнает, что такое FormID, если ресурс является конечной точкой API? Это передается как какой-то параметр запроса? - person 2GDave; 27.04.2014
comment
Идентификатор формы передается в качестве параметра строки запроса в представление, в котором размещается виджет, связанный с рассматриваемым источником данных. Функция viewShow — это обратный вызов, привязанный к событию показа представления, как предложил @AndreLiem. Дополнительная информация о параметрах просмотра: docs.telerik.com/ кендо-интерфейс/начало работы/мобильный/ - person Petyo Ivanov; 27.04.2014
comment
Большое спасибо за помощь от вас, ребята. Если бы я мог разделить вознаграждение в 50 между обоими, я бы сделал это, но я не мог, поэтому я присудил его на основе AUTOBIND, связанного с viewShow, так как это было отчасти ключом для меня, поскольку я не получал viewparm, поскольку он был обязательным. слишком рано. Спасибо еще раз! - person 2GDave; 29.04.2014