i18n() is not resolving keys from json File when using new $.fn.dataTable.Buttons()

Henrike Dufhues

Hello Folks,

i am using the button initialization to create different Buttons groups and want to localize the button texts.
For the Datatable creation i am using this:

var table = $('#table-id').DataTable({
        language: {
            "url": url
        }
    });

After that, i use the following line of code to create a button:

new $.fn.dataTable.Buttons( table, {
        name: 'someName',
        buttons: [
            {
                text: function (dt) {
                    return dt.i18n('buttons.validate', 'Validate Changes');
                },
                action: function (e) {
                   someAction();
                }
            }
        ]
    } );

In the language file i have something like this:

{
 "buttons": {
      "validate": "Prüfen"
  }
}

After looking at the Page it always shows me the default value, so i started to debug and found this in the datatables code:

i18n() - Function:

_api_register( 'i18n()', function ( token, def, plural ) {
        var ctx = this.context[0];
        var resolved = _fnGetObjectDataFn( token )( ctx.oLanguage );
    
        if ( resolved === undefined ) {
            resolved = def;
        }
    
        if ( plural !== undefined && $.isPlainObject( resolved ) ) {
            resolved = resolved[ plural ] !== undefined ?
                resolved[ plural ] :
                resolved._;
        }
    
        return resolved.replace( '%d', plural ); // nb: plural might be undefined,
    } );

_fnGetObjectDataFn() - Function

var fetchData = function (data, type, src) {
                var arrayNotation, funcNotation, out, innerSrc;
    
                if ( src !== "" )
                {
                    var a = _fnSplitObjNotation( src );
    
                    for ( var i=0, iLen=a.length ; i<iLen ; i++ )
                    {
                        //some checks if its a function or array

                        if ( data === null || data[ a[i] ] === undefined )
                        {
                            return undefined;
                        }

                    }
                }
                return data;
            };

The variable 'data' holds all the standard keys including the key i defined in the initialization of the Datatable. This means the url is present, but not the keys in the json file.
Because of that reason, the method above returns undefined and then the i18n() function returns the default value.

Is there a ways to include the localization of the json file while using new $.fn.dataTable.Buttons()?

Henrike Dufhues

I forgot about a live example:
http://live.datatables.net/gewededu/1/edit?js,output

allan

Thanks for the live example! The key thing here is that you are loading the language by Ajax. That means that the language file is loaded after the Buttons have been initialised (the first A in Ajax is "asynchronous"). You need to wait for the language to have been loaded before initialising the buttons. You can do that using the initComplete option: http://live.datatables.net/gewededu/2/edit .

Allan

Henrike Dufhues

Thank you very much.
This solved the issue!