updating a cell value based on another editable cell value in kendo grid asp.net mvc

Question

I have been struggling with this problem for two days, any help is hugely appreciated. I have a kendo grid, in which which has four cloumns,among which two can be edited and has editor template which contains dropdownlist.I want while editing based on some particular the value of one dropdown another column value will change.

ex: If I choose Exception value No then only Exception type will be blank.Code snippet is given below:

@using (Html.BeginPanelBody())
{
    @(Html.Kendo().Grid(Model)
    .Name("gridIssExcpListQueryResult")
    .Columns(columns =>
    {



  columns.Bound(m => m.BlNo).Title("B/L No").Locked().Width(90).HtmlAttributes(new { style = "text-align:center;" }).ClientTemplate("<a style=\"cursor: pointer;\" onclick=\"PccNet.eDOC.BlException.Ux.getBlExceptionQueryParams();\">#= BlNo #</a>");
        columns.Bound(m => m.VslName).Title("Vessel").Width(160);
        columns.Bound(m => m.VoyName).Title("Voyage").Width(160);
        columns.Bound(m => m.PolName).Title("Port of Loading").Width(160);

        columns.Bound(m => m.BLIssueStatus).Title("B/L Issue Status").Width(160);
        columns.Bound(m => m.IssueMethod).Title("B/L Issue Method").Width(160);


        columns.Bound(m => m.Exception).Title("Exception?").Width(160).
        EditorTemplateName("ExceptionConfirmDropdownPartial").HtmlAttributes(new { name = "Exception" })
.Width(100);



        columns.Bound(m => m.ExceptionType).Title("Exception Type").Width(160).
        EditorTemplateName("ExceptionTypeDropdownPartial").HtmlAttributes(new { name = "ExceptionType" });




    }
    ).AutoBind(true)
    .DataSource(dataSource => dataSource.Ajax().Read(read => read.Action("GetExceptionconfirmList", "BlExceptionConfirm").Data("PccNet.eDOC.BlException.Ux.getBlExceptionQueryParams"))

    .Batch(true)

.Model(model =>
{
    model.Id(p => p.BlNo);
    model.Field(p => p.BlNo).Editable(false);
    model.Field(p => p.VslName).Editable(false);
    model.Field(p => p.VoyName).Editable(false);
    model.Field(p => p.PolName).Editable(false);
    model.Field(p => p.BLIssueStatus).Editable(false);
    model.Field(p => p.IssueMethod).Editable(false);
    model.Field(p => p.Exception).Editable(true);
    model.Field(p => p.ExceptionType).Editable(true);
})


    ).Editable(editable => editable.Mode(Kendo.Mvc.UI.GridEditMode.InCell))
    .Scrollable(scroll => scroll.Height("Auto"))
    .Events(e => e.DataBound("PccNet.eDOC.BlException.Ux.gridBlExceptionQueryRsltDataBound"))
    
    .Selectable()


    )



    <div style="float: right;margin-top:15px;">
        <input id="btnConfExcp" class="k-button" type="button" value="Confirm Exception" onclick="PccNet.eDOC.BlException.Ux.confBlException();" />
        <input id="btnCloseExceptionPopup" style="width: 83px; vertical-align: top" class="k-button" type="button" value="close" onclick="PccNet.eDOC.BlException.Ux.closeblExceptionPopup();" />
    </div>
}


Editor Template:
@model string

@(Html.Kendo().DropDownList()
     .Name("Exception") // Name of the widget should be the same as the name of the property
     .HtmlAttributes(new { style = "width:100px;" })
     .DataTextField("Text")
     .DataValueField("Value")
     .BindTo(new List<PccNet.Infra.Common.ListItem>() {
         new PccNet.Infra.Common.ListItem(){ Text="Yes", Value="Y" },
         new PccNet.Infra.Common.ListItem(){ Text="No", Value="N" }


     })
 .Events(a => a.Change("PccNet.eDOC.BlException.Ux.assignExceptionValue"))
 )

@model string

@(Html.Kendo().DropDownList()
     .Name("ExceptionType") // Name of the widget should be the same as the name of the property
     .HtmlAttributes(new { style = "width:100px;" })
     .DataTextField("Text")
     .DataValueField("Value")
     .BindTo(new List<PccNet.Infra.Common.ListItem>() {
         new PccNet.Infra.Common.ListItem(){ Text="", Value="" },
         new PccNet.Infra.Common.ListItem(){ Text="Damage", Value="D" },
         new PccNet.Infra.Common.ListItem(){ Text="Short", Value="S" }


     })
     .Events(a => a.Change("PccNet.eDOC.BlException.Ux.assignExceptionTypeValue"))
 )

javascript:
assignExceptionValue: function (e) {
   

   var grid = $("#gridIssExcpListQueryResult").data("kendoGrid");
   var gridData = grid.dataSource.data();
   
   var currentRow = grid.select();
   var currentItem = grid.dataItem(currentRow);
  
   if (currentRow == undefined) {
       return;
   }
   

    
   var selectedVal = $("#Exception").data("kendoDropDownList").value();
   var selectedText = $("#Exception").data("kendoDropDownList").text();
   if (selectedVal == "N") {

         var currenRow = grid.select();
         currentItem = grid.dataItem(currenRow);
         currentItem["ExceptionType"]="";
}

This is not working.Please help

Answer 1

Try using the set method to updete the underlying observable model

if (selectedVal == "N") {
     var currenRow = grid.select();
     currentItem = grid.dataItem(currenRow);
     currentItem.set("ExceptionType","");
}