How to Refresh single column in Kendo UI Grid asp.net mvc? - html

Question

Here is my code for loading data into Kendo Grid:
#(Html.Kendo().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.CountryName);
columns.Bound(p => p.CountryCode);
columns.Bound(p => p.CountryCodeLength);
columns.Bound(p => p.CurrencyString);
columns.Bound(p => p.CountryISOName);
})
.Pageable(p =>
{
p.Enabled(true);
p.PageSizes(new int[] { 10, 20, 30, 40, 50 });
})
.Sortable()
.Selectable()
.Groupable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(p => p.ID))
.Read(read => read.Action("Country_Read", "Country")).PageSize(10)
)
.Events(events => events.Change("GridChange"))
.ToolBar(toolbar =>
{
toolbar.Template(
#<text>
<div id="Toolbar">
<a id="Add" href="#Url.Action("Create", "Country")" title="Add New Record"></a>
<a id="Edit" title="Edit Selected Record"></a>
<a id="Delete" title="Delete Selected Record"></a>
</div>
</text>);
})
)
How do I refresh the column CountryCodeLength on 10-15 seconds regularly? I tried refreshing the complete Grid, but I have some popup to be open inside the same grid. So while refreshing complete grid on working with popup, the popup will be lost. Please tell me how I can refresh a single column?
Here is the code that I used to refresh the whole grid:
$(document).ready(function()
{
var refreshId = setInterval( function() {
//GET YOUR GRID REFERENCE
var grid = $("#Grid").data("kendoGrid");
grid.dataSource.read();
}, 5000);
});

Answer 1

var gridData = $("#Grid").data("kendoGrid").dataSource;
var data = gridData.at(0);//data at 0 Location
data.set("CountryCodeLength", 20);//set the value here
you can use a polling script to refresh the value

Answer 2

var MyGrid = $("#MyGrid").data("kendoGrid");
var selectedItem = MyGrid.dataItem(MyGrid.select());
selectedItem.set("CountryCodeLength", 10);
MyGrid.tbody.find("tr[data-uid=\"" + selectedItem.uid + "\"]").addClass("k-state-selected");