All Components


    Grid / Inline editing


    In numerous scenarios there's a requirement not only to visualize data in a table structure, but to have the ability to manipulate this data and save changes.

    The Kendo UI grid widget supports data editing operations (create, update, destroy) via a simple configuration of its data source. All you have to do to enable data editing capabilities for the widget is to:

    • set the grid's editable configuration option
    • declare field definitions through the DataSource schema
    • configure the DataSource for performing CRUD data operations defining its transport->create/update/destroy attributes

    If you want to enable new records insertion, you can do that by enabling the relevant option in the grid toolbar. For deleting items you need to include a delete command column.

    This example aims to illustrate how to perform inline editing by setting the editable->inline option of the grid.

    More details about the grid editing capabilities can be found in the documentation here.

    HTML5/JavaScript source

    Also available for:

    API Reference
    • editing-inline.html
    • Sample service
    • Widget configuration

    Support & learning resources

    Grid for other technologies