Uncaught TypeError: e(...).parents(...).andSelf on Kendo UI Grid

I'm having problem with using Kendo UI Grid whenever I click on add new button it always produce this script error.enter image description here

This is the code that I'm using:

dataSource = new kendo.data.DataSource({
    batch: true,
    pageSize: 20,
    transport: {
        read: {
            url: 'SaladEntry/GetSupport2/',
            dataType: "json"
        },
        destroy: {
            url: 'SaladEntry/DeleteSupportKendo2/',
            type: "POST",
            contentType: 'application/json'
        },
        create: {
            url: 'SaladEntry/SaveSupportKendo2/',
            type: "POST",
            contentType: 'application/json',
            complete: function (e) {
                SupportGrid();
            }
        },
        update: {
            url: 'SaladEntry/EditSupportKendo2/',
            type: "POST",
            contentType: 'application/json',
            complete: function (e) {
                SupportGrid();
            }
        },
        parameterMap: function (options, operation) {
            if (operation == "read") {
                return saladparamObj;
            }
            else {
                options.models[0].CountryNo = $('#Country_No').val();
                var SaladParamSerialized = JSON.stringify(options.models);

                return SaladParamSerialized;
            } 
        }
    },
    schema: {
        model: {
            id: "PK",
            fields: {
                CountryNo: { editable: true, nullable: true },
                EffectiveDate: { type: "date" },
                stringEffectiveDate: { type: "string" },
                ScaleMin: { validation: { required: true } },
                ScaleMax: { validation: { required: true } },
                Currency: { type: "string" }
            }
        }
    },

    sort: {
        field: "stringEffectiveDate",
        dir: "desc",
        compare: function (a, b, dir) {
            return kendo.parseDate(a.EffectiveDate) - kendo.parseDate(b.EffectiveDate);
        }
    }
});

$("#grid").kendoGrid({
    dataSource: dataSource,
    pageable: true,
    height: 300, 

    toolbar: ["create"],
    columns: [
    {
        field: "stringEffectiveDate", title: "Date",
        template: "#= kendo.toString(kendo.parseDate(EffectiveDate, 'yyyy-MM-dd'), 'yyyy-MM-dd') #", width: "100px",
        sortable: {
            allowUnsort: false,
            compare: function (a, b, dir) {
                return kendo.parseDate(a.EffectiveDate) - kendo.parseDate(b.EffectiveDate);
            }
        }
    },
    { field: "EffectiveDate", title: "Effective Date", template: "#= kendo.toString(kendo.parseDate(EffectiveDate, 'yyyy-MM-dd'), 'yyyy-MM-dd') #", width: "100px" },
    { field: "ScaleMin", title: "BG1 Min", width: "100px" },
    { field: "ScaleMax", title: "BG7 Max", width: "100px" },
    { field: "Currency", title: "Currency", width: "100px" },
    { command: ["edit", "destroy"], title: "Commands", width: "160px" }



    ],
    height: 300,
    scrollable: true,
    sortable: true,
    filterable: true,
    pageable: true,
    resizable: true,
    selectable: true,
    editable: "popup",


    cancel: function (e) {

        nEdit();
    },
    edit: function(e) {
    e.container.find(".k-edit-label:first").hide();
    e.container.find(".k-edit-field:first").hide();
    if (!e.model.isNew()) {
        var dt = e.container.find("input[name=EffectiveDate]").data("kendoDatePicker");
        dt.enable(false);
    }
    }
}).css("background-color", "#C7D6A7");

No popup modal shown when I click on Add or Edit button. Below is the screenshot of my view. enter image description here

Answers 1

  • .andSelf was removed in jQuery 3.0. You are referencing 3.1.1. You'll have to downgrade jQuery or find an update for Kendo.


Related Articles