ShowTable of Contents
Translating the name picker to another language
This approach translates text and button labels of the extlib name picker dialog to another language.
The dialog uses the Dojo widget system "Dijit". And that provides a nice technique for creating new widgets based on an existing one.
Furthermore, some Dijit widgets contain the actual HTML for building the dialog simply as a string in the property "templateString". And Dijit widgets has some useful methods to hook into with custom code.
Using that, we create a new Dijit based on the extlib name picker and do some search & replace there:
<script>
dojo.provide("yn.dijit.PickerName");
dojo.declare(
"yn.dijit.PickerName",
[extlib.dijit.PickerName], {
postMixInProperties: function() {
this.inherited(arguments);
var t = this.templateString;
// change text in HTML
t = t.replace(/Search for/, 'Namen suchen');
// change button labels, add ">" in regex to make sure to select a button and nothing else
// the "g" option in the regex leads to javascript errors at runtime
t = t.replace(/>Search/, '>suchen');
t = t.replace(/>Add/, '>hinzufügen');
t = t.replace(/>Remove/, '>entfernen');
t = t.replace(/>Remove All/, '>alle entfernen');
t = t.replace(/>Cancel/, '>Abbruch');
this.templateString = t;
}
});
</script>
In this code english text and button labels are replaced with german ones.
Then we have to change the call to open the extlib name picker dialog so that our own dialog is opened instead:
<script>
var ynXSPSelectValue = XSP.selectValue;
XSP.selectValue = function(t, vars) {
if (t == "extlib.dijit.PickerName") {
ynXSPSelectValue("yn.dijit.PickerName", vars);
} else {
ynXSPSelectValue(t, vars);
}
}
</script>
Include both scripts at the top of the page and then every extlib name picker dialog will use the translated text and button labels.