Topic: datatable column header language
Hi,
I have a page with multi-language. I use i18n and when I change the language of the page search, palceholder, inputs etc. all labels are changing in datatable and also in page except for column headers. I can't understand why can't I change column header names when I change language.
Thanks,
ozgehan pro premium answered 5 years ago
Hi Magdalena,
I did manage to change translation on column headers. You were right i18n can't reach nested objects so I did add langKey to column
{
label: this.$t("Block"),
field: "blockNo",
sort: "asc",
langKey: "Block"
},
and listened language selection change event then I manually changed column headers language by doing
changeLanguage(key) {
return this.$t(key.toString());
}
Maybe this will help if someone has issue with that.
Closed
This topic is closed.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Closed
- User: Pro
- Premium support: No
- Technology: MDB Vue
- MDB Version: 6.0.0
- Device: computer
- Browser: chrome
- OS: windows
- Provided sample code: No
- Provided link: No
Magdalena Dembna staff premium commented 5 years ago
I haven't been using i18n before so I'm not sure how it works exactly. I think the problem might be the following: changes in the rows are being watched and every time a change is made, the datatable component triggers reload. Columns are assumed to be more static. Inspect the Datatable in your Vue dev tools - check the
data
field in props and whether it contains translated values. If so, you can try forcing component to update (f.e withkey
, there are several ways to do it). Let me know if that's the case. Kind regards, Magdalenaozgehan pro premium commented 5 years ago
Hi Magdalena, I inspected the data field but column names didn't translated by i18. but other properties of datatable such as searchbox,page names (Next,Previous) are changed. I also have noticed that page number combobox has " select an option label " which I can't find option to customize it .
Magdalena Dembna staff premium commented 5 years ago
If the data hasn't been changed in the component's data field, it's not an issue with lack of reactivity but i18 itself - and I don't think I can help you with that. Once the data is being translated and our component doesn't update those fields it is an issue with MDB. As for select an option - it's a mistake on our end, due to changes in the mdbSelect - it shouldn't be there, we will fix this issue in the upcoming release. Kind regards, Magdalena