Make add row permanently visible

[Logan]

I would like to remove the "Add" button on my kendo grid and instead have a permanently available add row at the bottom of the grid.  When the user clicks the update button in that grid it would fire the create command and add the row.

 

It looks like i can set the insert row to the bottom by using: 

.Editable(e => e.Mode(GridEditMode.InLine).CreateAt(GridInsertRowPosition.Bottom))

I then tried to make the add row visible by using the following code

.Events(e => e.DataBound("Adjustment_Bound"))

<script type="text/javascript">
    function Adjustment_Bound() {
        var grid = $("#Adjustment-grid").data("kendoGrid");
        grid.addRow();
    }

</script>

 

This however locked up the browser,  I am guessing because the addRow() causes the databound to get refired.

 

TIA,

Logan

[Konstantin Dikov]

Hello Logan,

The addRow method will fire the dataBound event, which is causing an endless recursion. In order to avoid this you could try to use a global variable for determining when to call the addRow method. I have tested the following simple condition and it seems to prevent the recursion:

shouldPreventAdd = false;
$("#grid").kendoGrid({
    dataSource: dataSource,
    navigatable: true,
    pageable: true,
    edit: function(e){
      shouldPreventAdd = false;
    },
    dataBound: function(e){
      if(!shouldPreventAdd){
        shouldPreventAdd = true;
        e.sender.addRow();
      }
    },

Best Regards,
Konstantin Dikov
Telerik by Progress