Localization

15 Dec 2018 / 11 minutes to read

Localization

All text in Kanban can be localized using ej.Kanban.Locale object. Please find the table with list of properties and its value in locale object.

Locale key words Text
[`EmptyCard`] No cards to display
[`SaveButton`] Save
[`CancelButton`] Cancel
[`EditFormTitle`] Details of
[`AddFormTitle`] Add New Card
[`SwimlaneCaptionFormat`] "- 8 item items "
[`FilterSettings`] Filters:
[`Min`] Min
[`Max`] Max
[`FilterOfText`] Of
[`Cards`] Cards
[`ItemsCount`] Items Count :
[`Unassigned`] Unassigned
[`AddCard`] Add Card
[`EditCard`] Edit Card
[`DeleteCard`] Delete Card
[`TopofRow`] Top of Row
[`BottomofRow`] Bottom of Row
[`MoveUp`] Move Up
[`MoveDown`] Move Down
[`MoveLeft`] Move Left
[`MoveRight`] Move Right
[`MovetoSwimlane`] Move to Swimlane
[`HideColumn`] Hide Column
[`VisibleColumns`] Visible Columns
[`PrintCard`] Print Card
[`Search`] Search

The following code example describes the above behavior.

  • html
  • <template>
        <div>
            <ej-kanban id="Kanban" e-data-source.bind="KanbanData" e-locale="de-DE" e-enable-total-count="true" e-key-field="Status" e-fields.bind="Field">
                <ej-kanban-column e-header-text="Backlog" e-key="Open"></ej-kanban-column>
                <ej-kanban-column e-header-text="In Progress" e-key="InProgress" e-constraints.bind="constraints"></ej-kanban-column>
                <ej-kanban-column e-header-text="Done" e-key="Close"></ej-kanban-column>
            </ej-kanban>
        </div>
    </template>
  • javascript
  • export class Kanban {
        constructor() {
            this.KanbanData = [
               { Id: 1, Status: "Open", Summary: "Analyze the new requirements gathered from the customer.", Type: "Story", Priority: "Low", Tags: "Analyze,Customer", Estimate: 3.5, Assignee: "Nancy", ImageUrl: "/images/kanban/1.png", RankId: 1 },
               { Id: 2, Status: "InProgress", Summary: "Improve application performance", Type: "Improvement", Priority: "Normal", Tags: "Improvement", Estimate: 6, Assignee: "Andrew Fuller", ImageUrl: "/images/kanban/2.png", RankId: 1 },
               { Id: 3, Status: "Open", Summary: "Arrange a web meeting with the customer to get new requirements.", Type: "Others", Priority: "Critical", Tags: "Meeting", Estimate: 5.5, Assignee: "Janet Leverling", ImageUrl: "/images/kanban/3.png", RankId: 2 },
               { Id: 4, Status: "InProgress", Summary: "Fix the issues reported in the IE browser.", Type: "Bug", Priority: "Release Breaker", Tags: "IE", Estimate: 2.5, Assignee: "Janet Leverling", ImageUrl: "/images/kanban/3.png", RankId: 2 },
               { Id: 5, Status: "Testing", Summary: "Fix the issues reported by the customer.", Type: "Bug", Priority: "Low", Tags: "Customer", Estimate: "3.5", Assignee: "Steven walker", ImageUrl:"/images/kanban/5.png", RankId: 1 },
               { Id: 6, Status: "Close", Summary: "Arrange a web meeting with the customer to get the login page requirements.", Type: "Others", Priority: "Low", Tags: "Meeting", Estimate: 2, Assignee: "Michael Suyama", ImageUrl: "/images/kanban/6.png", RankId: 1 },
               { Id: 7, Status: "Validate", Summary: "Validate new requirements", Type: "Improvement", Priority: "Low", Tags: "Validation", Estimate: 1.5, Assignee: "Robert King", ImageUrl: "/images/kanban/7.png", RankId: 1 },
               { Id: 8, Status: "Close", Summary: "Login page validation", Type: "Story", Priority: "Release Breaker", Tags: "Validation,Fix", Estimate: 2.5, Assignee: "Laura Callahan", ImageUrl: "/images/kanban/8.png", RankId: 2 },
               { Id: 9, Status: "Testing", Summary: "Fix the issues reported in Safari browser.", Type: "Bug", Priority: "Release Breaker", Tags: "Fix,Safari", Estimate: 1.5, Assignee: "Nancy", ImageUrl: "/images/kanban/1.png", RankId: 2 },
               { Id: 10, Status: "Close", Summary: "Test the application in the IE browser.", Type: "Story", Priority: "Low", Tags: "Testing,IE", Estimate: 5.5, Assignee: "Margaret", ImageUrl: "/images/kanban/4.png", RankId: 3 },
               { Id: 11, Status: "Validate", Summary: "Validate the issues reported by the customer.", Type: "Story", Priority: "High", Tags: "Validation,Fix", Estimate: 1, Assignee: "Steven walker", ImageUrl: "/images/kanban/5.png", RankId: 1 },
               { Id: 12, Status: "Testing", Summary: "Check Login page validation.", Type: "Story", Priority: "Release Breaker", Tags: "Testing", Estimate: 0.5, Assignee: "Michael Suyama", ImageUrl: "/images/kanban/6.png", RankId: 3 },
               { Id: 13, Status: "Open", Summary: "API improvements.", Type: "Improvement", Priority: "High", Tags: "Grid,API", Estimate: 3.5, Assignee: "Robert King", ImageUrl: "/images/kanban/7.png", RankId: 3 },
               { Id: 14, Status: "InProgress", Summary: "Add responsive support to application", Type: "Epic", Priority: "Critical", Tags: "Responsive", Estimate: 6, Assignee: "Laura Callahan", ImageUrl: "/images/kanban/8.png", RankId: 3 },
               { Id: 15, Status: "Open", Summary: "Show the retrieved data from the server in grid control.", Type: "Story", Priority: "High", Tags: "Database,SQL", Estimate: 5.5, Assignee: "Margaret", ImageUrl: "/images/kanban/4.png", RankId: 4 },
               { Id: 16, Status: "InProgress", Summary: "Fix cannot open user’s default database SQL error.", Priority: "Critical", Type: "Bug", Tags: "Database,Sql2008", Estimate: 2.5, Assignee: "Janet Leverling", ImageUrl: "/images/kanban/3.png", RankId: 4 },
               { Id: 17, Status: "Testing", Summary: "Fix the issues reported in data binding.", Type: "Story", Priority: "Normal", Tags: "DataBinding", Estimate: "3.5", Assignee: "Janet Leverling", ImageUrl: "/images/kanban/3.png", RankId: 4 },
               { Id: 18, Status: "Close", Summary: "Analyze SQL server 2008 connection.", Type: "Story", Priority: "Release Breaker", Tags: "Grid,Sql", Estimate: 2, Assignee: "Andrew Fuller", ImageUrl: "/images/kanban/2.png", RankId: 4 },
               { Id: 19, Status: "Validate", Summary: "Validate dataBinding issues.", Type: "Story", Priority: "Low", Tags: "Validation", Estimate: 1.5, Assignee: "Margaret", ImageUrl: "/images/kanban/4.png", RankId: 1 },
               { Id: 20, Status: "Close", Summary: "Analyze grid control.", Type: "Story", Priority: "High", Tags: "Analyze", Estimate: 2.5, Assignee: "Margaret", ImageUrl: "/images/kanban/4.png", RankId: 5 }];
            this.Field = { primaryKey: 'Id', content: 'Summary', swimlaneKey: 'Assignee', tag:'Tags'};
            ej.Kanban.Locale["de-DE"] = {
                  EmptyCard: "Keine Karten angezeigt werden",
                  SaveButton: "Speichern",
                  CancelButton: "stornieren",
                  EditFormTitle: "Details von ",
                  AddFormTitle: "Neue Karte hinzufügen",
                  SwimlaneCaptionFormat: "- 8 Artikel  Artikel ",
                  FilterSettings: "Filter:",
                  FilterOfText: "Von",
                  Max: "Max.",
                  Min: "Min.",
                  Cards: "Karten",
                  ItemsCount:"Artikel Graf :",
                  Unassigned:"Nicht zugewiesen",
              };
             this.constraints={max:"2"};
        }
    }

    The following output is displayed as a result of the above code example.

    Localization