OData grid binding

This is a fiddle to demonstrate the re-binding of the kendo grids in a scenario where the datasource does not match the initial grid configuration

by sparksterz

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.silver.min.css">
<script src="http://yourjavascript.com/24422351017/namespace.js"></script>
<script src="http://yourjavascript.com/51420312325/mpsquickview.js"></script>
<script src="http://yourjavascript.com/12431292315/pharos.js"></script>
<script src="http://yourjavascript.com/12314224343/mpsgriddatabindings.js"></script>
<script src="http://yourjavascript.com/3317561212/mpsodatagrid.js"></script>
<script src="http://cdn.kendostatic.com/2013.3.1316/js/kendo.all.min.js"></script>
<input id="quickViewDD" />
<div id="grid" style="height:430px"></div>

JavaScript

var dataSourceConfig = {
    type: "odata",
    transport: {
        read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
    },
    schema: {
        model: {
            fields: {
                OrderID: {
                    type: "number"
                },
                Freight: {
                    type: "number"
                },
                ShipName: {
                    type: "string"
                },
                OrderDate: {
                    type: "date"
                },
                ShipCity: {
                    type: "string"
                }
            }
        }
    },
    serverPaging: true,
    serverFiltering: true,
    serverSorting: true
};

/*$("#grid").kendoGrid({
    dataSource: new kendo.data.DataSource(dataSourceConfig),
    height: 430,
    filterable: true,
    sortable: true,
    pageable: true,
    columns: [{
        field: "OrderID",
        filterable: false
    },
        "Freight", {
        field: "OrderDate",
        title: "Order Date",
        width: 120,
        format: "{0:MM/dd/yyyy}"
    }, {
        field: "ShipName",
        title: "Ship Name",
        width: 260
    }, {
        field: "ShipCity",
        title: "Ship City",
        width: 150
    }]
});*/

var Grid = new pharos.MPS.utils.MPSODataGrid({
    dataSourceConfig: dataSourceConfig,
    filterable: true,
    sortable: true,
    groupable: true,
    pageable: true,
    useSelector: false,
    selectorInputColumn: "ID",
    columnsChooserWindowTitle: "",
    gridPageSizeStorageKey: "GridPageSize",
    messagesDisplay: "{0:0} - {1:0} of {2:0} items",
    messagesOf: "of {0:0}",
    targetDomElement: $("#grid"),
    customerId: "",
    dataPath: {},
    filterTooltip: "Filter",
    onSelectedRowsChanged: function () {},
    columns: [{
        field: "OrderID",
        title: "Order ID",
        hidden: false
    }, {
        field: "ShipName",
        title: "Ship Name",
        hidden: false
    }, {
        field:...