Localization in EJ2 JavaScript MultiColumn ComboBox control

14 Jun 20242 minutes to read

The Localization library allows you to localize static text content of the noRecordsTemplate property according to the culture currently assigned to the MultiColumn ComboBox.

Locale key en-US (default)
noRecordsTemplate No records found

Loading translations

To load translation object to your application, use load function of L10n class.

In the following sample, French culture is set to the MultiColumn ComboBox and no data is loaded. Hence, the noRecordsTemplate property displays its text in French culture.

var columns = [
  { field: 'ContactName', header: 'Contact Name', width: 90 },
  { field: 'CustomerID', header: 'Customer ID', width: 160 }
];

var multiColumnComboboxObj = new ej.multicolumncombobox.MultiColumnComboBox({
  dataSource: [],
  columns: columns,
  locale: 'fr-BE',
  placeholder: 'Sélectionnez un client'
});
multiColumnComboboxObj.appendTo('#multicolumn');

ej.base.L10n.load({
  'fr-BE': {
    'multicolumncombobox': {
          'noRecordsTemplate': "Aucun enregistrement trouvé"
      }
  }
});
<!DOCTYPE html>
<html lang="en">

<head>
    <title>Essential JS 2 MultiColumn ComboBox</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Typescript UI Controls">
    <meta name="author" content="Syncfusion">
    <link href="styles.css" rel="stylesheet">
    <link href="https://cdn.syncfusion.com/ej2/32.1.19/material.css" rel="stylesheet" />

    <script src="https://cdn.syncfusion.com/ej2/32.1.19/dist/ej2.min.js" type="text/javascript"></script>
<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js" type ="text/javascript"></script>
</head>

<body>

    <div id='container' style="margin:50px auto 0; width:500px;">
        <br>
        <input type="text" tabindex="1" id='multicolumn' />
    </div>
    <script src="index.js" type="text/javascript"></script>
</body>

</html>