HTML5 Web app开发工具Kendo UI Web教程:Grid网格控件本地化

原创|使用教程|编辑:龚雪|2013-11-06 10:49:26.000|阅读 2602 次

概述:Kendo UI Web包含数百个创建HTML5 web app的必备元素,包括UI组件、数据源、验证、一个MVVM框架、主题、模板等。为了使得产品可以符合不同市场的本地化需求和语言,Kendo UI中的网格控件提供了一种方法,来帮助用户通过使用配置选项来本地化用户的界面。

相关链接:

Kendo UI Web包含数百个创建HTML5 web app的必备元素,包括UI组件、数据源、验证、一个MVVM框架、主题、模板等。

    为了使得产品可以符合不同市场的本地化需求和语言,Kendo UI中的网格控件提供了一种方法,来帮助用户通过使用配置选项来本地化用户的界面。

工具栏控件的本地化

toolbar: [
    //name - name of the available commands, text - text to be set on the button
    { name: "create", text: "Custom Create" },
    { name: "save", text: "Custom Save" },
    { name: "cancel", text: "Custom Cancel" }
]

列命令的本地化

columns: [
    { field: "FirstName", title: "First Name" },
    { field: "LastName", title: "Last Name" },
    { command: [
            {
                name: "edit",
                text: { // sets the text of the "Edit", "Update" and "Cancel" buttons
                    edit: "CustomEdit",
                    update: "CustomUpdate",
                    cancel: "CustomCancel"
                }
            }, 
          { name: "destroy", text: "CustomDelete" } // sets the text of the "Delete" button
        ],
        title: " "
    }
]

过滤器菜单本地化

filterable: {
    messages: {
        info: "Custom header text:", // sets the text on top of the filter menu
        filter: "CustomFilter", // sets the text for the "Filter" button
        clear: "CustomClear", // sets the text for the "Clear" button

        // when filtering boolean numbers
        isTrue: "custom is true", // sets the text for "isTrue" radio button
        isFalse: "custom is false", // sets the text for "isFalse" radio button

        //changes the text of the "And" and "Or" of the filter menu
        and: "CustomAnd",
        or: "CustomOr"
    },
    operators: {
        //filter menu for "string" type columns
        string: {
            eq: "Custom Equal to",
            neq: "Custom Not equal to",
            startswith: "Custom Starts with",
            contains: "Custom Contains",
            endswith: "Custom Ends with"
        },
        //filter menu for "number" type columns
        number: {
            eq: "Custom Equal to",
            neq: "Custom Not equal to",
            gte: "Custom Is greater than or equal to",
            gt: "Custom Is greater than",
            lte: "Custom Is less than or equal to",
            lt: "Custom Is less than"
        },
        //filter menu for "date" type columns
        date: {
            eq: "Custom Equal to",
            neq: "Custom Not equal to",
            gte: "Custom Is after or equal to",
            gt: "Custom Is after",
            lte: "Custom Is before or equal to",
            lt: "Custom Is before"
        },
        //filter menu for foreign key values
        enums: {
            eq: "custom Is Equal to",
            neq: "custom Is Not equal to"
        }
    }
} 

组头本地化

groupable: {
    messages: {
        empty: "Custom message text"
    }
}

列菜单本地化

columnMenu: {
    messages: {
        sortAscending: "Sort Ascending",
        sortDescending: "Sort Descending",
        filter: "Filter",
        columns: "Columns"
    }
}

页面本地化

pageable: {
    messages: {
        display: "{0} - {1} of {2} items", //{0} is the index of the first record on the page, {1} - index of the last record on the page, {2} is the total amount of records
        empty: "No items to display",
        page: "Page",
        of: "of {0}", //{0} is total amount of pages
        itemsPerPage: "items per page",
        first: "Go to the first page",
        previous: "Go to the previous page",
        next: "Go to the next page",
        last: "Go to the last page",
        refresh: "Refresh"
    }
}

>>>Kendo UI Web下载

慧都特邀Kendo UI原厂开发工程师举行线上公开课,使用该控件的朋友千万别错过哦>>查看详情

kendo ui 公开课



标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果

文章转载自:慧都控件

登录慧都网发表评论登录


暂无评论...

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
title
相关厂商
相关产品
Kendo UI Web

运用JavaScript和HTML5就能快速创建性能最优的Web应用程序

在线客服 在线QQ 电话咨询
400-700-1020
反馈
在线客服系统
live chat