In Kendo UI Grid for jQuery we have the following:

"editable": {

    "createAt": "bottom"

}

How it can be done in Kendo Grid for Vue.JS ?

----------------------------------------------------------------------------------------------------------------------------------

Bug report

In Grid(Wrapper) in UI for Vue, the editable-create-at is not changing Grid's "add new row" behavior when it is set to "bottom".

Reproduction of the problem

1. Open this Stackblitz and run it
2. Press the "Add new record" button and see that the new record is being added to at the top of the Grid

A workaround that could be applied is to use :editable="{createAt:'bottom'}" instead of :editable-create-at="bottom"

Current behavior

The new rows are being added to the bottom of the Grid with :editable-create-at="bottom"configuration applied.

Expected/desired behavior

When :editable-create-at="bottom" is applied the new records in the Grid should be added to its bottom

Environment

• Kendo UI version: 2019.2.621
• jQuery version: x.y
• Browser: [all]

I have a kendo wrapper grid with local datasource pointing to vue state.
There is a button "Update" which will update the state so that the grid will be updated as well and it works.

But, if I firstly click the button "Test" (just only a same value assignment to state) and then click "Update", strangely it does not work so the grid has no change.
I finally found out the reason is that after clicked "Test" then "Update", the vue state updated BUT the kendo grid datasource won't (out of sync unexpectedly)
So the temp solution is I have to manually assign the state to the datasource so that the grid will be updated.

Repo: https://stackblitz.com/edit/dqsbeo

My question is why, after clicked 'Test', the kendo grid datasource became cached and out of sync with the vue state?
If I don't click 'Test', they do sync always.
Problem occur only when "same value assignment" to the state. If "different value assignment", no problem.

<div id="vueapp">
    <kendo-datasource ref="dsDS" :data="localDataSource"></kendo-datasource>
    <kendo-grid :data-source-ref="'dsDS'">
        <kendo-grid-column :field="'ProductID'"
                           :title="'ID'"
                           :width="40"></kendo-grid-column>
        <kendo-grid-column :field="'ProductName'"></kendo-grid-column>
        <kendo-grid-column :field="'UnitPrice'"
                           :title="'Unit Price'"
                           :width="120"
                           :format="'{0:c}'"></kendo-grid-column>
        <kendo-grid-column :field="'UnitsInStock'"
                           :title="'Units In Stock'"
                           :width="120"></kendo-grid-column>
        <kendo-grid-column :field="'Discontinued'" :width="120"></kendo-grid-column>
    </kendo-grid>
    <input type="button" value="Test" @click="test" />
    <input type="button" value="Update" @click="update" />
</div>

new Vue({
    el: '#vueapp',
    data: {
        localDataSource: [{
                "ProductID": 1,
                "ProductName": "Chai",
                "UnitPrice": 18,
                "UnitsInStock": 39,
                "Discontinued": false,
            },
            {
                "ProductID": 2,
                "ProductName": "Chang",
                "UnitPrice": 17,
                "UnitsInStock": 40,
                "Discontinued": false,
            },
            {
                "ProductID": 3,
                "ProductName": "Aniseed Syrup",
                "UnitPrice": 10,
                "UnitsInStock": 13,
                "Discontinued": false,
            }
        ]
    },
    methods: {
      test: function(e) {
        this.localDataSource = JSON.parse(JSON.stringify(this.localDataSource)); //same value assignment
        console.log('test');
      },
      update: function(e) {
        this.localDataSource.splice(0, 1, this.localDataSource[1]); //replace the first object with second object
      },
    }
})

Hello,

when I add some repeating daily events, all is ok. But when i try do delete one of them (in green on the attachment), i can't and i have this message bellow.

Can you help me please ?

best regards,

Kévin