`

自定义动态数据源的Kendo UI grid Dropdown Editor

 
阅读更多

此实例是根据当前数据的某个值动态过滤一个静态的数据源

 

$scope.serviceItem1Editor=function (container, options) {

 

            var checkedValues=options.model.itemCatCode.split(",");

            var filter = {

              logic: "or",

              filters: $.map(checkedValues, function(value) {

                return {

                  operator: "eq",

                  field: "itemCat",

                  value: value

                };

              })

            };

            $scope.serviceItemDS.filter(filter);

            $("<input data-bind='value:"+options.field+"'+ />")

                .attr("id", "ddl_serviceItem1")

                .appendTo(container)

                .kendoDropDownList({

                    dataSource: $scope.serviceItemDS,

                    dataTextField: "itemDesc",

                    dataValueField: "itemCode",

                    template: "<span data-id='${data.itemCode}'>${data.itemDesc}</span>"

 

                });

          }

 

$scope.serviceItemDS = new kendo.data.DataSource({

            transport: {

              read: {

                  url: $scope.serviceRoot+"/booking/findServicItems",

                  dataType: "json",

                  type: "POST",

                  contentType: "application/json"

              },

              parameterMap:function(options, operation) {

                  if(operation==="read"){

                    var catCode="";

                    return JSON.stringify(catCode);

                  }

              }

            }

          });

分享到:
评论

相关推荐

    动态设置显示kendoui grid控件某一列的格式

    本篇文章将深入探讨如何动态地设置Kendo UI Grid中某一列的显示格式,特别是涉及到日期选择器(DatePicker)的自定义过滤功能。 首先,理解`kendoui grid customfilter`标签,这通常意味着我们需要实现自定义的过滤...

    Kendo UI框架grid的Excel导出功能改进js代码

    Kendo UI框架提供了强大的Excel导出功能,通过Grid的saveAsExcel能方便地导出Grid中的数据,而且格式美观大方,使用起来也非常方便。但是在实际使用中不是很理想,主要有以下两个问题: 1. 导出的列数据是原始值 ...

    Kendoui grid多级分组表格展现

    应用kendoui grid实现的多级分组表格展现,里面包含了表格的分组统计以及单表合计功能、还有针对表格的刷新以及子表格刷新功能。此功能是在原有demo版本上改进,增加了很多的个别需求实现,在原来的版本是做不到的。...

    KendoUI速查手册--中文

    1. 数据网格(Grid):Kendo UI Grid 是一个高度可配置的数据展示和管理工具,支持数据分页、排序、过滤、编辑等功能,同时提供了强大的行选择、分组、汇总和远程数据绑定能力。 2. 日历(Calendar):提供基本的...

    标准kendo ui-grid控件用法

    Kendo UI Grid的数据源可以是本地数组、远程服务或其他Kendo UI DataSource实例。配置数据源时,可以设置`transport`、`schema`、`pageSize`等属性,如: ```javascript dataSource: { transport: { read: { ...

    kendo ui 实现复杂表头

    该代码类里面实现的主要操作: 1.ajax 访问后代接口,并将结果返回值绑定到kendo ui 的grid上。 2. 实现复杂的kendo ui 的grid的表头设置,这个是本人亲自写的,并且经过验证是正确的

    ui jquery kendo ui 一个不错的国外ui kendoui 又名剑道UI

    3. **数据绑定**:Kendo UI与各种数据源(如JSON、XML、OData等)紧密结合,支持自动数据绑定和远程数据加载,简化数据操作。 4. **模板化**:使用Kendo UI,可以通过HTML模板定义组件的外观和结构,方便定制和维护...

    Kendo UI Grid

    Kendo UI ,在ASP.NET MVC 4中使用Kendo UI Grid

    kendoui.for.jquery.2018.3.911.commercial

    在报表和数据可视化方面,Kendo UI提供了丰富的图表类型,如柱状图、折线图、饼图、热力图等,支持动态数据绑定和交互式操作。这些图表可以与后端数据源无缝对接,实时展示数据变化,为决策者提供直观的信息视图。 ...

    kendo-ui-js-grid.zip_Kendo_grid js

    在数据源方面,Kendo UI Grid支持多种类型的数据源,包括Ajax、JSON、XML等。在描述中提到的服务交互,通常指的是通过Ajax与后台服务器进行数据交换。我们可以配置Grid的数据源的`transport`属性,定义`read`、`...

    Kendo UI for Vue.docx

    * 高度可配置:Kendo UI for Vue 的组件都可以根据需要进行配置和自定义,以满足不同的商业需求。 * 良好的支持:Kendo UI for Vue 提供了良好的支持文档和社区支持,帮助开发者快速解决问题。 Kendo UI for Vue 是...

    kendoui asp.net mvc

    同时,Kendo UI支持多种数据源,包括本地数据、远程服务数据以及AJAX数据加载,这使得它在处理大数据和复杂交互时表现出色。 在ASP.NET MVC中,Kendo UI的服务器端包装器是关键特性。这些包装器是.NET类,为每个...

    Kendo UI Grid示例下载

    Kendo UI Grid为开发者提供了100多种丰富的网格功能,从基本的筛选、排序,到高级的编页、分层数据分组等等。毫不夸张的说,Kendo UI Grid是同类产品中数一数二的佼佼者。耳听为虚眼见为实,下面我为大家整理了它的...

    Kendo UI 开发教程

    但Kendo UI在功能和组件数量上更为丰富,增加了模板(Template)、数据源绑定(DataSource)、MVVM支持,以及对移动设备的兼容性。Kendo UI的核心组件包括各种UI控件和数据显示组件,它还提供了一个自适应的移动框架...

    Kendo UI控件详细使用说明代码详解

    kendo UI 各个控件的使用说明,着重对grid的使用做了详解,包括增删改查以及查询功能

    kendo ui学习资料

    通过自定义这些样式,开发者可以调整Kendo UI组件的外观以符合项目需求。 总体而言,这份“Kendo UI学习资料”是全面了解和掌握Kendo UI的一个宝贵资源,涵盖了从基础使用到高级定制的多个层面,对于初学者和进阶...

    前台框架UI kendoui

    3. **数据绑定**:kendoui支持多种数据源,如JSON、XML或Web服务,通过数据绑定将后台数据与UI组件关联。 4. **自定义样式**:利用`styles`目录下的CSS文件,可以对组件外观进行定制,以符合品牌风格或用户偏好。 5....

    Kendo UI官方demo

    Kendo UI是一个强大的框架用于快速HTML5 UI开发。基于最新的HTML5、CSS3和... Kendo UI包含了开发现代JavaScript开发所需要的所有一切,包括:强大的数据源,通用的拖拉(Drag-and-Drop)功能,模板,和UI控件。

    kendo UI 2017 最新版 源码+实例

    Grid组件尤其强大,能与各种后端数据源无缝集成。 2. **数据可视化组件**:包括图表(Chart)、Gantt图、地图(Map)等,用于创建动态、交互式的统计和数据分析视图。这些组件支持多种图表类型,如条形图、饼图、...

    [Kendo UI] 移动应用开发 Kendo UI Mobile 实现 英文版

    [Packt Publishing] 移动应用开发 Kendo UI Mobile 实现 英文版 [Packt Publishing] Building Mobile Applications Using Kendo UI Mobile and ASP NET Web API E Book ☆ 图书概要:☆ Get started with ...

Global site tag (gtag.js) - Google Analytics