Auto increment column

4 posts, 0 answers
  1. Howard
    Howard avatar
    67 posts
    Member since:
    Nov 2011

    Posted 02 Jan 2013 Link to this post

    Hi Telerik Team,

    I've a grid with column "sequence" and it needs to be auto incremented. 

    if you see the picture, when I click on Add new item, the value in sequence column needs to be 40 and not 5.

    Can you please let me know how to create an increment column which takes the latest added data (sequence) and increments it?

    Thank you
  2. Daniel
    Admin
    Daniel avatar
    2224 posts

    Posted 07 Jan 2013 Link to this post

    Hello Niroj,

    This can be achieved by using the DataSource change event to check if a new item is added, and set the value to the field:

    var current = 5;
    function change(e) {
        if (e.action == "add") {
            var item = e.items[0];
            item.Sequence = current;
            current += 5;
        }
    }
            


    Regards,
    Daniel
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Howard
    Howard avatar
    67 posts
    Member since:
    Nov 2011

    Posted 08 Jan 2013 Link to this post

    Hi Daniel,

    Thanks for your reply.

    But the current value is coming from the database.

    In Telerik MVC extensions, this is how I used to do it.

    <script type = "text/javascript">
        var currentValue;
        function Grid_onLoad(e) {               
            var grid = $(this).data("tGrid");
            currentValue = grid.editing.defaultDataItem.SEQUENCE;
        }
     
        function Grid_onEdit(e) {
            if (e.mode == "insert") {         
                $(e.form).find("#SEQUENCE ").val(++currentValue);       
            }
        }
    </script>
    But in Kendo Grid, there is no onLoad function, so I can't initialise the currentValue. Is there any way that I can achieve the same?

    Thank you
  4. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2194 posts

    Posted 11 Jan 2013 Link to this post

    Hi Niroj,

    Basically you can bind the DataBound event using jQuery One on document ready to execute the code from "Grid_onLoad" function - please check the example below:

    ...
        .DataSource(dataSource => dataSource
            .Ajax()
            .Model(model => {
                model.Id(p => p.ProductID);
                //Set the default value for SEQUENCE
                model.Field(m => m.SEQUENCE).DefaultValue(customDefaultValue);
            })
            .Create(update => update.Action("EditingInline_Create", "Grid"))
            .Read(read => read.Action("EditingInline_Read", "Grid"))
            .Update(update => update.Action("EditingInline_Update", "Grid"))
            .Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
        )
    )
    <script type="text/javascript">
        var currentValue;
     
        $(function () {
            //On document ready bind DataBound event with jQuery One
            $("#Grid").data("kendoGrid").one("dataBound", function (e) {
                var grid = e.sender;
                //Get the default value for this field (must be set in the Grid configuration)
                currentValue = dataSource.options.schema.model.fields.SEQUENCE.defaultValue;
            })
        })
     
    ...
    Kind Regards,
    Vladimir Iliev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top