jQuery: caricare dinamicamente i dati di una tabella con JSON

Possiamo caricare dinamicamente i dati di una tabella con jQuery utilizzando JSON.

La soluzione è la seguente:

"use strict";

(function( $ ) {
    $.fn.jsonTable = function( options ) {
        options = $.extend({
            json: "data.json"
        }, options);

        return this.each(function() {
            var $table = $( this );
            var $tbody = $table.find( "tbody" );

            $.getJSON( options.json, function( data ) {
                var rows = data.rows;
                var html = "";

                rows.forEach(function( row ) {
                    html += '<tr>';
                    for( var i = 0; i < row.length; i++ ) {
                        var cell = row[i];
                        html += '<td>' + cell + '</td>';
                    }
                    html += '</tr>';
                });

                $tbody.html( html );
            });
        });
    };
})( jQuery );