jQuery Grid Change Options of Autogenerated Editors

In order to change the options of autogenerated columns’ editors you need to handle the editorCreating event. It is fired just before columns editors to be initialized. The purpose of the event is to pass options to the columns editors. The arguments passed to the event are following:

  • e.field– the name of the columns’s field for which the editor will be created
  • e.options– empty object which will be passed as editor’s options
$("#grid1").shieldGrid({
    dataSource: {
        data: products,
        schema: {
            fields: {
                id: { path: "ProductID", type: Number},
                name: { path: "ProductName", type: String, nullable: false },
                quantity: { path: "SupplierID", type: Number },
                price: { path: "UnitPrice", type: Number },
                units: { path: "UnitsInStock", type: Number },
                discontinued: { path: "Discontinued", type: Boolean },
                myDate: { path: "d", type: Date }
            }
        }
    },
    events: {
        editorCreating: function(e) {
            if (e.field == "price") {
                e.options = { max: 50 };
            }
        }
    },
    rowHover: false,
    columns: [
        { field: "id" },
        { field: "name", width: "200px" },
        { field: "quantity" },
        { field: "price" },
        { field: "units" },
        { field: "discontinued" },
            { field: "myDate", format: "{0:MM/dd/yyyy}" }
    ],
    editing: {
        enabled: true,
        event: "doubleclick
        type: "cell"
    }
});