Remove Dirty Item when error is returned

2 posts, 0 answers
  1. Chad
    Chad avatar
    7 posts
    Member since:
    Oct 2014

    Posted 28 Feb 2015 Link to this post

    I have a grid that is bound to a datasource. On the datasource if an error is returned on create my popup goes away and the new item stays in the grid (datasource). How do I either prevent the popup from going away and make the user cancel or try again, or remove the item if there is an error?

    function getAntiForgeryToken() {
        return  $('input[name=__RequestVerificationToken]').val();

        var viewModelNotes = kendo.observable({
            notesDataSource: new{
                transport: {
                    read: {
                        url: "/Vendor/GetVendorNotes",
                        dataType: "json",
                        data: {
                            VendorId: $("#Vendor_VendorId").val()
                    create: {
                        url: "/Vendor/CreateVendorNote",
                        dataType: "json",
                        type: "POST",
                        data: {
                            VendorId: $("#Vendor_VendorId").val(),
                            __RequestVerificationToken: getAntiForgeryToken()
                schema: {
                    model: {
                        id: "VendorNoteId",
                        fields: {
                            VendorNoteId: { editable: false, nullable: true }
                    errors: "errorMsg"
                pageSize: 20,
                error: function (e) {
                    toastr.options = {
                        "positionClass": "toast-bottom-full-width"
                    toastr.error('Unable to save new note' + e.errors, 'Uh Oh!');

        kendo.bind($('#VendorNoteWrapper'), viewModelNotes);

            dataSource: viewModelNotes.get("notesDataSource"),
            scrollable: false,
            toolbar: ["create"],
            columns: [
            { field: "ItemText", title: "Note" },
            { field: "CreateDate", title: "Create Date" },
            { field: "CreatedByDisplay", title: "Created By" },
            { field: "LastModDate", title: "Modified" }],
            editable: {
                mode: "popup",
                template: kendo.template($("#vendorNoteEditor").html())

  2. Rosen
    Rosen avatar
    3214 posts

    Posted 03 Mar 2015 Link to this post

    Hi Chad,

    In order to revert the changes when error occurs, you should use the DataSource cancelChanges method. Similar to the following:

    error: function (e) {
        toastr.options = {
            "positionClass": "toast-bottom-full-width"
        toastr.error('Unable to save new note' + e.errors, 'Uh Oh!');

    If you want to keep the editor open you will need to use the Grid's dataBinding event to prevent the widget from re-drawing and hiding the popup editor. 

    error: function(e) {       
        var grid = $("#VendorNotesGrid").getKendoGrid();"dataBinding", function (args) {

    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top