Grid Command is not working for MVC on Firefox or IE

[tritue]

Hi,

I tried the Kendo Grid (2012.2.710) with the following example for MVC 4. However, the command button Add New Record does not work (not effect when mouse over, click nothing happens) for Firefox, but it works for Chrome. But if it is plain html , it works fine for both.

I am not sure what could be problem? Appreciate if someone can help.

Thanks

 <div id="example" class="k-content">
            <div id="grid"></div>


            <script>
                $(document).ready(function () {
                    var crudServiceBaseUrl = "http://demos.kendoui.com/service",
                        dataSource = new kendo.data.DataSource({
                            transport: {
                                read: {
                                    url: crudServiceBaseUrl + "/Products",
                                    dataType: "jsonp"
                                },
                                update: {
                                    url: crudServiceBaseUrl + "/Products/Update",
                                    dataType: "jsonp"
                                },
                                destroy: {
                                    url: crudServiceBaseUrl + "/Products/Destroy",
                                    dataType: "jsonp"
                                },
                                create: {
                                    url: crudServiceBaseUrl + "/Products/Create",
                                    dataType: "jsonp"
                                },
                                parameterMap: function (options, operation) {
                                    if (operation !== "read" && options.models) {
                                        return { models: kendo.stringify(options.models) };
                                    }
                                }
                            },
                            batch: true,
                            pageSize: 30,
                            schema: {
                                model: {
                                    id: "ProductID",
                                    fields: {
                                        ProductID: { editable: false, nullable: true },
                                        ProductName: { validation: { required: true } },
                                        UnitPrice: { type: "number", validation: { required: true, min: 1 } },
                                        Discontinued: { type: "boolean" },
                                        UnitsInStock: { type: "number", validation: { min: 0, required: true } }
                                    }
                                }
                            }
                        });


                    $("#grid").kendoGrid({
                        dataSource: dataSource,
                        pageable: true,
                        height: 400,
                        toolbar: ["create"],
                        columns: [
                            "ProductName",
                            { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "150px" },
                            { field: "UnitsInStock", title: "Units In Stock", width: "150px" },
                            { field: "Discontinued", width: "100px" },
                            { command: ["edit", "destroy"], title: "&nbsp;", width: "210px" }],
                        editable: "inline"
                    });
                });
            </script>
        </div>

[tritue]

;)