Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Kendo MVC Grid - How to make cell Editable based on a model value

Tags:

c#

kendo-ui

Our Kendo Grid DataSource looks like this:

.DataSource(dataSource => dataSource
.Ajax()
.PageSize(10)
.Events(events => events.Error("error_handler"))
.Model(model =>
    {
     model.Id(m => m.MilestoneId);
     model.Field(m => m.ProjectName).Editable(false);
     model.Field(m => m.Name).Editable(false);
     model.Field(m => m.Status).Editable(??????);
    })

For the last field (Status) we need to provide a bool value for Editable. However, I would like this value to come from the value of a property on our model. The model has a property called IsAvailable and I would like the bool to be that value.

Basically we only want the Status column to be editable if IsAvailable is true in the model.

The C# code on the model for that property is:

public bool IsAvailable{ get; set; }

Does anyone know the correct syntax to access this value?

I have tried:

model.Field(m => m.Status).Editable((model.Field(m => m.IsAvailable).ToString()).AsBool());

which compiles but does not work; it is always returning false for all cases.

like image 220
cktech Avatar asked Jan 13 '23 02:01

cktech


1 Answers

Using Timothy Walter's link, I found a solution to the issue, by using the edit event as he suggested.

Here is what my code ended up looking like:

.Events(events =>
    {
        events.Edit("edit_handler");
    })
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(10)
    .Events(events => events.Error("error_handler"))
    .Model(model =>
        {
            model.Id(m => m.MilestoneId);
            model.Field(m => m.ProjectName).Editable(false);
            model.Field(m => m.Name).Editable(false);
            model.Field(m => m.Status).Editable(true);
        })

and the Javascript is:

<script type="text/javascript" language="javascript">

function edit_handler(e) {

    if (!e.model.isNew()) {            
        var statusDropDown = e.container.find("input[name=Status]").data("kendoDropDownList");

        if (!e.model.IsAvailable) {
            statusDropDown.enable(false);
        }
    }
</script>
like image 161
cktech Avatar answered Jan 28 '23 18:01

cktech