검도 그리드 재 장전 / 갱신
Javascript를 사용하여 Kendo Grid를 다시로드하거나 새로 고치는 방법은 무엇입니까?
언젠가 또는 사용자 조치 후 그리드를 다시로드하거나 새로 고쳐야하는 경우가 종종 있습니다.
당신이 사용할 수있는
$('#GridName').data('kendoGrid').dataSource.read(); <!-- first reload data source -->
$('#GridName').data('kendoGrid').refresh(); <!-- refresh current UI -->
나는 결코 상쾌하지 않습니다.
$('#GridName').data('kendoGrid').dataSource.read();
홀로 항상 나를 위해 일합니다.
$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();
최근 프로젝트에서 일부 드롭 다운 선택에서 발생하는 일부 호출을 기반으로 Kendo UI Grid를 업데이트해야했습니다. 다음은 내가 사용했던 것입니다.
$.ajax({
url: '/api/....',
data: { myIDSArray: javascriptArrayOfIDs },
traditional: true,
success: function(result) {
searchResults = result;
}
}).done(function() {
var dataSource = new kendo.data.DataSource({ data: searchResults });
var grid = $('#myKendoGrid').data("kendoGrid");
dataSource.read();
grid.setDataSource(dataSource);
});
잘하면 이것은 당신에게 시간을 절약 할 것입니다.
이러한 답변 중 하나만이 read
약속 을 반환 한다는 사실을 얻지 못하므로 새로 고침을 호출하기 전에 데이터가로드 될 때까지 기다릴 수 있습니다.
$('#GridId').data('kendoGrid').dataSource.read().then(function() {
$('#GridId').data('kendoGrid').refresh();
});
데이터 수집이 인스턴트 / 동기화 인 경우에는 필요하지 않지만 즉시 리턴되지 않는 엔드 포인트에서 발생하는 것보다 더 많습니다.
핸들러에서 그리드에 대한 참조를 원하지 않으면이 코드를 사용할 수 있습니다.
$(".k-pager-refresh").trigger('click');
새로 고침 버튼이 있으면 그리드를 새로 고칩니다. 버튼은 다음과 같이 활성화 할 수 있습니다.
[MVC GRID DECLARATION].Pageable(p=> p.Refresh(true))
실제로는 다릅니다.
$('#GridName').data('kendoGrid').dataSource.read()
uid
테이블 행 의 속성을 새로 고칩니다.$('#GridName').data('kendoGrid').refresh()
같은 uid를 떠난다
내 경우에는 매번 갈 사용자 정의 URL이 있었다. 결과의 스키마는 동일하게 유지됩니다.
나는 다음을 사용했다.
var searchResults = null;
$.ajax({
url: http://myhost/context/resource,
dataType: "json",
success: function (result, textStatus, jqXHR) {
//massage results and store in searchResults
searchResults = massageData(result);
}
}).done(function() {
//Kendo grid stuff
var dataSource = new kendo.data.DataSource({ data: searchResults });
var grid = $('#doc-list-grid').data('kendoGrid');
dataSource.read();
grid.setDataSource(dataSource);
});
해야 할 일은 kendoGrid 바인딩 코드에 이벤트 .Events (events => events.Sync ( "KendoGridRefresh")) 를 추가하는 것입니다 .Ajax 결과에 새로 고침 코드를 작성할 필요가 없습니다.
@(Html.Kendo().Grid<Models.DocumentDetail>().Name("document")
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Model(model => model.Id(m => m.Id))
.Events(events => events.Sync("KendoGridRefresh"))
)
.Columns(columns =>
{
columns.Bound(c => c.Id).Hidden();
columns.Bound(c => c.UserName).Title(@Resources.Resource.lblAddedBy);
}).Events(e => e.DataBound("onRowBound"))
.ToolBar(toolbar => toolbar.Create().Text(@Resources.Resource.lblNewDocument))
.Sortable()
.HtmlAttributes(new { style = "height:260px" })
)
또한 .js 파일에서 다음 전역 함수를 추가 할 수 있습니다. 따라서 프로젝트의 모든 검도 그리드에 대해 호출하여 kendoGrid를 새로 고칠 수 있습니다.
function KendoGridRefresh() {
var grid = $('#document').data('kendoGrid');
grid.dataSource.read();
}
Jquery .ajax를 사용하여 데이터를 얻었습니다. 데이터를 현재 그리드로 다시로드하려면 다음을 수행해야합니다.
.success (function (result){
$("#grid").data("kendoGrid").dataSource.data(result.data);
})
You can use the below lines
$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();
For a auto refresh feature have a look here
By using following code it automatically called grid's read method and again fill grid
$('#GridName').data('kendoGrid').dataSource.read();
An alternative way to reload the grid is
$("#GridName").getKendoGrid().dataSource.read();
You can always use $('#GridName').data('kendoGrid').dataSource.read();
. You don't really need to .refresh();
after that, .dataSource.read();
will do the trick.
Now if you want to refresh your grid in a more angular way, you can do:
<div kendo-grid="vm.grid" id="grid" options="vm.gridOptions"></div>
vm.grid.dataSource.read();`
OR
vm.gridOptions.dataSource.read();
And don't forget to declare your datasource as kendo.data.DataSource
type
I want to go back to page 1 when I refresh the grid. Just calling the read() function will keep you on the current page, even if the new results don't have that many pages. Calling .page(1) on the datasource will refresh the datasource AND return to page 1 but fails on grids that aren't pageable. This function handles both:
function refreshGrid(selector) {
var grid = $(selector);
if (grid.length === 0)
return;
grid = grid.data('kendoGrid');
if (grid.getOptions().pageable) {
grid.dataSource.page(1);
}
else {
grid.dataSource.read();
}
}
In order to do a complete refresh, where the grid will be re-rendered alongwith new read request, you can do the following:
Grid.setOptions({
property: true/false
});
Where property can be any property e.g. sortable
You may try:
$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();
If you are desiring the grid to be automatically refreshed on a timed basis, you can use the following example which has the interval set at 30 seconds:
<script type="text/javascript" language="javascript">
$(document).ready(function () {
setInterval(function () {
var grid = $("#GridName").data("kendoGrid");
grid.dataSource.read();
}, 30000);
});
</script>
Just write below code
$('.k-i-refresh').click();
$("#theidofthegrid").data("kendoGrid").dataSource.data([ ]);
The default/updated configuration/data of the widgets is set to automatically bind to an associated DataSource.
$('#GridId').data('kendoGrid').dataSource.read();
$('#GridId').data('kendoGrid').refresh();
You can also refresh your grid with sending new parameters to Read action and setting pages to what you like :
var ds = $("#gridName").data("kendoGrid").dataSource;
ds.options.page = 1;
var parameters = {
id: 1
name: 'test'
}
ds.read(parameters);
In this example read action of the grid is being called by 2 parameters value and after getting result the paging of the grid is in page 1.
The easiest way out to refresh is using the refresh() function. Which goes like:
$('#gridName').data('kendoGrid').refresh();
while you can also refresh the data source using this command:
$('#gridName').data('kendoGrid').dataSource.read();
The latter actually reloads the data source of the grid. The use of both can be done according to your need and requirement.
$("#grd").data("kendoGrid").dataSource.read();
참고URL : https://stackoverflow.com/questions/18399805/reloading-refreshing-kendo-grid
'Programing' 카테고리의 다른 글
Spring Boot-예외로 모든 요청과 응답을 한곳에 기록하는 방법은 무엇입니까? (0) | 2020.06.05 |
---|---|
SQL Server에서 누계 계산 (0) | 2020.06.05 |
정적 컨텍스트에서 리소스 컨텐츠를 얻으려면 어떻게해야합니까? (0) | 2020.06.04 |
Laravel의 Eloquent 타임 스탬프 비활성화 (0) | 2020.06.04 |
Strtotime ()이 dd / mm / YYYY 형식에서 작동하지 않습니다 (0) | 2020.06.04 |