Checkbox Column problem

2 posts, 0 answers
  1. Goran
    Goran avatar
    7 posts
    Member since:
    Sep 2014

    Posted 16 Oct 2014 Link to this post

    Hello, I'm having trouble setting up checkbox column in my grid. I am using inline edit mode and my checkbox column is se up like this

    @(Html.Kendo().Grid<URBIS.ViewModels.PropisiViewModel>()
    .Name("grid")
    .Events(e => e.DataBound("onDataBound"))
    .Columns(columns =>
    {
     
        columns.Bound(p => p.GrupePropisa).ClientTemplate("#=GrupePropisa.Naziv#").EditorTemplateName("GrupePropisa").Width(220);
        columns.Bound(p => p.Naziv).Width(220);
        columns.Bound(p => p.SluzbeniList).Width(220);
        //columns.Bound(p => p.Aktivan).Width(120);
        columns.Bound(p => p.Aktivan)
                  .Title("Aktivan")
                  .ClientTemplate("<input type='checkbox' #= Aktivan ? checked='checked': '' # class='chkbx' />")
                  .HtmlAttributes(new {style = "text-align: center"})
                  .Width(50);
    })

    and script handling check events is
    $(function () {
        $('#grid').on('click', '.chkbx', function () {
            var checked = $(this).is(':checked');
            var grid = $('#grid').data().kendoGrid;
            var dataItem = grid.dataItem($(this).closest('tr'));
            dataItem.set('Aktivan', checked);
        });
    });

    The problem I'm experiencing is very weird. Binding to bool field from database works fine, editing also but when inserting, checkbox always passes as false. Very weird. Also, I would like the checkbox to be disabled if the row is in read only mode and to be editable if the row is in edit/insert mode. Any help? Lost few hours on this and this is too much :)
  2. Alexander Popov
    Admin
    Alexander Popov avatar
    1444 posts

    Posted 20 Oct 2014 Link to this post

    Hello Goran,

    In that case I would suggest removing the "click" event handler and let the default editor template deal with the value of the checkbox. Also, adding a "disabled" attribute to the input element in the client template should help. For example: 
    columns.Bound(p => p.Aktivan)
                  .Title("Aktivan")
                  .ClientTemplate("<input type='checkbox' #= Aktivan ? checked='checked': '' # disabled='true' />")
                  .HtmlAttributes(new {style = "text-align: center"})
                  .Width(50);

    I am not exactly sure what is causing the new items to be sent with false though. Could you please examine the Create request in the browser's network tab and check if the correct values are sent to the server? This would help us identify if the issue is client or server-side.

    Regards,
    Alexander Popov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top