buttons

buttons – Contains collection of predefined buttons which will be added into the toolbar. Each button can have the following properties:

  • cls – css class which will be added to the button element
  • caption – A string template which will be used for the caption of the button
  • commandName – Specified the command which the button will execute. There are several build-in commands: save, insert, cancel, excel and pdf
  • . The build in buttons are used for grid editing and exporting.

  • click – Gets function as argument which will be executed when the button is clicked

This setting has lower precedence than the template toolbar option.

$("#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 }
        }
    }
},
toolbar: [{
    buttons: [
        {
            cls: "mybuttonCssClass",
            commandName: "details",  
            caption: "Test",
            click: function (e) {
                 
            }
        },
        { commandName: "save", caption: "save" },
        { commandName: "cancel", caption: "cancel" },
        { commandName: "insert", caption: "insert" }
    ]
    }
],
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"
}
});
function templateFunc(item) {
    $("").shieldRating({ value: 3 }).appendTo(item);
}