Kendo Grid Custom Toolbar button Enable/Disable

问题

I have a kendo grid with save button in the Tool bar panel. I have a proposed discount column which is editable and if the user enters whole numbers between 0 and 100(excluding decimals) , the save button should be visible or enabled otherwise invisible or disabled. I was able to achieve making the button invisible or disable but when they enter correct value, the button was not getting visible or enabled. Please help me. I just started working on Kendo UI recently.

function setEnabled(enabled) {
    if (enabled) {
        // $(".k-grid-nstToolbarBtn").removeClass("k-state-disabled");
        $(".k-grid-nstToolbarBtn").show();
    }
    else {
        // $(".k-grid-nstToolbarBtn").addClass("k-state-disabled");
        $(".k-grid-nstToolbarBtn").removeAttr("href");
        $(".k-grid-nstToolbarBtn").hide();
    }
}



$('#NSTGrid').kendoGrid({
           toolbar: [{ type: "button", text: "Save", name: "nstToolbarBtn", className: "k-grid-saveData" }],
           dataSource: {
               data: data.ReportData,
               schema: {
                   model: {
                       fields: {

                           ProposedDiscount: {
                               validation: { 
                                   required: true,
                                   proposeddiscountvalidationcvalidation: function (input) {
                                       if (input.val() != "" && input.is("[name='ProposedDiscount']")) {
                                           input.attr("data-proposeddiscountvalidationcvalidation-msg", "Proposed Discount should be whole number");
                                           setEnabled(false);
                                           return input.val() >= 0 && input.val() < 101 && input.val() % 1 == 0;

                                       } else {


                                           setEnabled(true);
                                           return true;
                                       }
                                   }
                               }
                           },


                           ProductApprovedDiscount: { type: "decimal", editable: false },
                           BAN: { type: "string", editable: false },

回答1:

I think the value passed to your setEnabled function needs to be the same as what you return as the validation result. Please try the following change:

proposeddiscountvalidationcvalidation: function (input) {
    if (input.val() != "" && input.is("[name='ProposedDiscount']")) {
        input.attr("data-proposeddiscountvalidationcvalidation-msg", "Proposed Discount should be whole number");
        var valid = input.val() >= 0 && input.val() < 101 && input.val() % 1 == 0;
        setEnabled(valid);
        return valid;
    } else {
        return true;
    }
}

来源：https://stackoverflow.com/questions/52640067/kendo-grid-custom-toolbar-button-enable-disable