var grid;
var columnMap = {
en: {
'name': 'Name',
'artist': 'Artist',
'type': 'Type',
'release': 'Release',
'genre': 'Genre'
},
ko: {
'name': '제목',
'artist': '가수',
'type': '종류',
'release': '발매일',
'genre': '장르'
},
'ja-JP': {
'name': '曲のタイトル',
'artist': 'アーティスト名',
'type': '歌の種類',
'release': '発売日',
'genre': 'ジャンル'
}
};
var messageMap = {
'ja-JP': {
display: {
noData: 'データが存在していません。'
}
}
};
function createGrid(localeCode) {
return new tui.Grid({
el: $('#grid'),
data: [],
scrollX: false,
scrollY: false,
columns: createColumns(localeCode)
});
}
function createColumns(localeCode) {
var columnData = columnMap[localeCode];
var columns = [];
_.each(columnData, function(title, name) {
columns.push({
title: title,
name: name
});
});
return columns;
}
grid = createGrid('en'); // Set default language to English ('en')
$('#locale-code').on('change', function() {
var localeCode = $(this).val();
var messages = messageMap[localeCode];
if (grid) {
grid.destroy();
}
tui.Grid.setLanguage(localeCode, messages); // Change language by locale code
grid = createGrid(localeCode);
});