2014-02-11 3 views
0

나는 3 개의 부분 뷰가있는 메인 뷰가 있습니다. 부분 뷰 중 하나에는 정렬이 가능한 검도 그리드가 있습니다.검도 ui 그리드 정렬 부분보기

@(Html.Kendo().Grid(Model) 
    .Name("tasksgrid") 
    .Sortable() 
    .Filterable() 
    .HtmlAttributes(new { style = "height:100%; font-size:14px;" }) 
    .Columns(columns => 
    { 
     columns.Bound(e => e.Url).Title("URL").Hidden(); 
     columns.Bound(e => e.Id).Title("ID").Hidden(); 

     columns.Template(@<img src="@item.OperatorCreated.ImageSource" style="width:80px;height:80px;"/>).ClientTemplate(" ").Width(100).Title("Picture"); 
     columns.Bound(e => e.Subject).Template(@<div> 
      <div style="font-size: 20px;">@item.OperatorCreated.Name</div> 
      <div>@item.Subject<br />@item.Message</div> 
     </div>).Title("Details").HtmlAttributes(new {id = "detailcolumn"}); 
     columns.Bound(e => e.DateTimeCreated).Title("Date").Width(100).HtmlAttributes(new { id = "datecolumn" }); 
    })   
    .Selectable(selectable => selectable.Mode(GridSelectionMode.Single)) 
     .DataSource(dataSource => dataSource 
      .Server() 
      .Model(model => model.Id(p => p.Id)) 
     ) 
    .Events(events => events.Change("onChange")) 
    .Scrollable() 
) 

이 부분보기는 다른보기에서 특정 작업이 선택 될 때만 렌더링됩니다. 그런 다음 그리드를 채우기 위해 데이터를 검색합니다.

function RefreshTasks(name) { 
    var serviceUrl = "/Tasks/PopulateTasks?actionname=" + name; 
    var request = $.post(serviceUrl); 

    request.done(
     function (data) { 
      $("#tasks").html(data); 
     } 
    ); 
} 

다음과 같은 URL이 생성 된 그리드에서 수행되는 정렬 할 때 "로컬 호스트 : 1772/tasksgrid-종류 = DateTimeCreated-내림차순 & tasksgrid 그룹 = & tasksgrid 필터 ="전체 페이지를 새로 고침 그리드와의 부분 뷰가 더 이상 존재하지 않는다는 것을 의미합니다.

이 URL을 부분보기에만 표시하는 방법이 있습니까?

이 구현을 위해 필요한 것을 정확히 수행 할 수있는 방법을 찾았습니다.

$("#tasksgrid .k-link").click(function (e) {//call the function when column header is clicked 
    var thelink = e.target.href;//get the url that would be navigated to on sort 

    var serviceUrl = thelink; 
    var request = $.post(serviceUrl);//post the url 

    request.done(
     function (data) { 
      $("#tasks").html(data);//update div 
     } 
    ); 

    return false;//cancels navigation 
}) 

답변

1

Ajax 바인딩을 사용하려면 눈금을 구성해야합니다. 그렇지 않으면 전체 페이지가 새로 고침됩니다. 자세한 내용은 documentation에서 확인할 수 있습니다.