2012-11-07 2 views
1

나는 그 중 하나를 확장 할 때 javascript가 다른 모든 행을 축소하도록하고 있습니다. 한 번에 한 행을 확장하려고합니다. 나는 자바 스크립트에 상당히 익숙하므로 누구나 올바른 방향으로 나를 가리킬 수 있기를 바랍니다.Telerik에서 자세히보기 MVC Grid

나는 내가 찾은이 예제를 통해 보였지만, 어떤 이유로 내 코드가 나던 행 축소 Expand/Collapse all DetailViews in a grid

가 Shouldn't 내가 자바 스크립트에서하고 미안 같은 인덱스를 축소?

내 Telerik 그리드 MVC에서 면도기보기 :

<div> 
@(Html.Telerik().Grid<RentableUnit>() 
      .Name("RentableUnits") 
      .Columns(columns => 
         { 
          columns.Bound(e => e.UnitID).Hidden(); 
          columns.Bound(e => e.Name).Width(800); 
          columns.Bound(e => e.IsExpanded).Hidden(); 
         }) 
      .ClientEvents(events => events.OnRowDataBound("employees_onRowDataBound") 
             .OnDetailViewExpand("unit_onDetailViewExpand") 
             .OnDetailViewCollapse("unit_onDetailViewCollapse") 
             .OnDetailViewExpand("toggleDetail") 
             ) 
      .DetailView(details => details.ClientTemplate(
       //stuff in template 
      ) 
    .DataBinding(dataBinding => dataBinding.Ajax().Select("RentableUnits", "Home")) 
    .Sortable() 
) 
</div> 

내 자바 스크립트 :이 트릭을 할 것입니다

function toggleDetail(e) { 
     var grid = $(this).data('tGrid'); 
     grid.$rows().each(function (index) { 
      //TODO: exclude the expanded row 
      grid.collapseRow(index); //doesn´t collapse! 
    }); 
} 

답변

3

는 :

function toggleDetail(e){ 

    var grid = $(this).data('tGrid'); 
    grid.$rows().not(e.masterRow).each(function(index, row){ 
    grid.collapseRow(row); 
    }); 
} 

당신이 있습니다 2 개의 핸들러가에 대해 정의 됨 OnDetailViewExpand 이벤트.

+0

와우! 트릭을 한 @Rustam에게 감사드립니다! 당신은 내게 많은 문제를 저장했습니다 :) (btw, 나는 두 번 그 이벤트를 정의했는지 알지 못했습니다.) – gardarvalur