On-Demand Ajax DataSource for FuelUX DataGrid

gistfile1.js

(function (root, factory) {
        if (typeof define === 'function' && define.amd) {
            define(['underscore'], factory);
        } else {
            root.AjaxOnDemandDataSource = factory();
        }
    }(this, function () {

        var AjaxOnDemandDataSource = function(options) {
                this._formatter = options.formatter;
                this._columns = options.columns;
                this._delay = options.delay || 0;
                this._data = options.data;

                // allows us to pass in the URL to get data from via Ajax
                this._data_url = options.data_url;

                // allows us to specify the name of the key in the json object returned
                // by options.data_url to set "data" from
                this._data_key = options.data_key || '';

                // allows us to initially load data via Ajax
                this._initial_load_from_server = options.initial_load_from_server || false;

                // Instruct the DataGrid to always load data from the server
                this._always_load_from_server = options.always_load_from_server || false;

                // An optional parameter that instructs the DataGrid to not reload
                // after an event. Set this to `true` on an instance of your data source
                // to enable
                this.reload_data_from_server = false;
            };

        AjaxOnDemandDataSource.prototype = {
            columns: function() {
                return this._columns;
            },

            data: function(options, callback) {
                self = this;

                setTimeout(function() {
                    var data = $.extend(true, [], self._data),
                        count = data.length;

                        // reload the DataGrid via ajax if any of these conditions are true
                        if (self.reload_data_from_server || self._initial_load_from_server || self._always_load_from_server)
                        {
                            $.ajax(options._data_url, {
                                dataType: 'json',
                                async: false,
                                type: 'GET'
                            }).done(function(json) {
                                data = json[self._data_key];
                                count = data.length;
                            });
        
                            // After data has been loaded via ajax, set these optional parameter back to their original state
                            self.reload_data_from_server = false;
                        }

                    // SEARCHING
                    if (options.search) {
                        data = _.filter(data, function (item) {
                            var match = false;

                            _.each(item, function (prop) {
                                if (_.isString(prop) || _.isFinite(prop)) {
                                    if (prop.toString().toLowerCase().indexOf(options.search.toLowerCase()) !== -1) match = true;
                                }
                            });

                            return match;
                        });
                    }

                    // SORTING
                    if (options.sortProperty) {
                        data = _.sortBy(data, options.sortProperty);
                        if (options.sortDirection === 'desc') data.reverse();
                    }

                    // FILTERING
                    if (options.filter) {
                        data = _.filter(data, function (item) {
                            switch(options.filter.value) {
                                case 'salarygt100k':
                                    if(item.salary >= 100000) return true;
                                    break;
                                default:
                                    return true;
                                    break;
                            }
                        });
                    }
                    
                    // PAGING
                    startIndex = options.pageIndex * options.pageSize,
                    endIndex = startIndex + options.pageSize,
                    end = (endIndex > count) ? count : endIndex,
                    pages = Math.ceil(count / options.pageSize),
                    page = options.pageIndex + 1,
                    start = startIndex + 1;
                    data = data.slice(startIndex, endIndex);

                    if (self._formatter)
                        self._formatter(data);

                    callback({
                        data: data,
                        start: start,
                        end: end,
                        count: count,
                        pages: pages,
                        page: page
                    });
                }, this._delay);
            }
        };

        return AjaxOnDemandDataSource;
    }));
    
var things_data_source = new AjaxOnDemandDataSource({
        data_url: '{% url things %}',  // values from Django view
        data_key: 'things',
        columns: {{ datagrid_columns|safe }}, // values from Django view
        data: {{ jobs_list|safe }},  // values from Django view
        formatter: function(items) {
            format_columns(items);
        },
        stretchHeight: true
    }),

    datagrid = $('#my-grid').datagrid({
        dataSource: things_data_source,
        itemsText: 'Things',
        itemText: 'Thing '
    });

This could be improved upon by factoring in pagination at the server level. Pulling every record and leaving javascript to handle the filtering will prove taxing on larger databases.