ReadOnly lines in Grid

[Martin]

Hi,
I have a Grid with incell edits rows.
I search since the last 2 day to found a solution to have some line with attribute Readonly or disabled if the cell date is <= than a @ViewData[“DisabledDate“]. I don't want user to modify this lines.

I found this way : http://dojo.telerik.com/UQaGo  .... but it a inline edit mode. I have to find a solution with InCell mode. I don't want to have to click "update" and "save" on each row.

 

Thank and sorry for my English.

 

My grid code :

@(Html.Kendo().Grid<Mentorat.Models.Intervention>()
   .Name("grid")
   .Columns(columns =>{
            columns.Bound(c => c.Date_Intervention).Title("Date").Format("{0:yyyy/MM/dd HH:mm:ss}").Width(130).ClientGroupFooterTemplate("#= count # intervention(s)").ClientFooterTemplate("#= count # intervention(s)");
           //columns.Bound(c => c.Date_Intervention).Width(130).Title("Date").ClientGroupFooterTemplate("#= count # intervention(s)").ClientFooterTemplate("#= count # intervention(s)").HtmlAttributes(new { @class = "templateCell" }).ClientTemplate((
                  //    @Html.Kendo().DateTimePicker().Name("date_#=No_Intervention#").Format("{0:yyyy/MM/dd HH:mm}").HtmlAttributes(new { data_bind = "value:Date_Intervention" }).ToClientTemplate()).ToHtmlString()
                  //);
                  columns.Bound(c => c.Duree_Intervention).Title("Durée (min.)").Width(70).ClientGroupFooterTemplate("Total : #= kendo.format('{0:0.00}', sum/60)# hrs").ClientFooterTemplate("Total : #= kendo.format('{0:0.00}', sum/60)# hrs");
                  columns.ForeignKey(c => c.No_Mentore_Intervention, (System.Collections.IEnumerable) ViewData["ListeMentor"], "No_Mentore", "NomComplet_Mentore").Title("Mentoré").Width(160).ClientGroupHeaderTemplate("#= getHeaderMentores(value,data)#");
                  columns.Bound(c => c.Description_Intervention).Title("Description").Width(300);
                  columns.Command(command => { command.Destroy(); }).Width(65);
              })
              .ToolBar(toolbar =>
              {
              toolbar.Create();
              toolbar.Custom().Name("RepartirTemps").Text("Répartir").HtmlAttributes(new { id = "RepartirTemps", @class = "k-plus" }).Url("#");
              toolbar.Save();
              toolbar.Excel();
              })
              .Editable(editable => editable.Mode(GridEditMode.InCell))
              .Pageable()
              .Filterable(ftb => ftb.Mode(GridFilterMode.Menu))
              .Groupable()
              .Events(events => events.DataBound("onDataBound"))
              .Events(events => events.Edit("onEdit"))
              .DataSource(dataSource => dataSource
                  .Ajax()
                  .Events(e => e.Change("onChange"))
                  .Batch(true)
                  .PageSize(20)
                  .Model(model => model.Id(p => p.No_Intervention))
                  .Read(read => read.Action("Interventions_Read", "Interventions"))
                  .Create(create => create.Action("Interventions_Create", "Interventions"))
                  .Update(update => update.Action("Interventions_Update", "Interventions"))
                  .Destroy(destroy => destroy.Action("Interventions_Destroy", "Interventions"))
                  .Aggregates(ag =>
                  {
                      ag.Add(p => p.Duree_Intervention).Sum();
                      ag.Add(p => p.Date_Intervention).Count();
                  })
              )
        )




 

[Patrick | Technical Support Engineer, Senior]

Hello Martin,

I suggest using the method closeCell() to disable editing during the Edit event.

edit: function(e){
          if(e.model.UnitPrice < 20){  //add your logic here...
              this.closeCell();
      }
  }

I have created this Kendo UI Dojo by Progress which shows this approach.

Hope this helps!

Regards,
Patrick
Telerik by Progress

[Martin]

Thank Patrick,

It work for "input" but not for button. But i found the solution and i will share with other user :)

I disabled the buttons in each readonly row in the databound event. At the end i add a style to the buttons.

This is my code :

    function onEdit(e)
    {
        if (Date.parse(e.model.Date_Intervention) < Date.parse(_dateMax)) {
            this.closeCell();
            this.table.focus();
        }
     }

function onDataBound(e) {
       var grid = this;

       grid.tbody.find('>tr').each(function () {
           var dataItem = grid.dataItem(this);
           if (dataItem != null)
           {
               if (Date.parse(dataItem.Date_Intervention) < Date.parse(_dateMax)) {
                   $(this).find('.k-grid-delete').attr('disabled', true).prop('disabled', true);
               }
           }

       });
}

<style>
    a[disabled] {
        pointer-events: none;
    }
</style>

Thank a other time :)

[Patrick | Technical Support Engineer, Senior]

Hello Martin,

Glad everything is working!

Regards,
Patrick
Telerik by Progress