드롭 다운 목록에 따라 검도 그리드 열을 변경하는 방법

Question

우리는 검도 UI를 사용한다는 점에서 웹 응용 프로그램 프로젝트를 개발 중입니다. 우리가 드롭 다운에서 선택한 것의 첫 번째 열 제목/제목을 만들 수 있습니까? 예 : - 일련 번호가 검색되면 일련 번호가 검색의 첫 번째 열에 있어야합니다. 그러나 컬럼 정의를 일반적으로 정렬 된 방식으로 정의 했으므로이를 얻을 수 없습니다. 선택에 따라 나머지 열은 숨 깁니다. 예 :

xxx.GridColDef = [ { 
    field : "serialNo", 
    title : "Serial No", 

}, { 
    field : "firstname", 
    title : "firstname", 
    }, { 
    field : "lastnameo", 
    title : "lastname", 
    }, 

드롭에서 i가 먼저 이름을 선택하면 이름 아래 첫 번째 열에 있어야한다. 하지만 직렬로 첫 번째 열을 받고 있어요 아무 방법이 있습니까? 각각에 대해 별도의 열 정의를 추가하지 않아도됩니다.

검도 버전 - 2012.1.322

이없는 나는 분명 수동으로

---

미안하지 않다 경우 열 재 주문을 사용하지 않는 자동으로 수행되어야한다. 내가 원하는 아래로 내가

제품 번호 이름 성 DOB가

처음에는 그리드가 아래

일련 번호 이름 성 생년월일 것이 드롭에서

입니다

사용자가 드롭 다운에서 "이름"을 선택하면 다음과 같아야합니다.

성 이름 시리얼 번호 성 DOB

희망이 있습니다. 더 많은 설명이 필요하면 알려주세요. 이를위한 솔루션을 제공해 주셔서 감사합니다.

한가지 더 : -

내가 드롭 다운에서 선택할 수 없습니다 생각이 바이올린의 "바이올린은 검도 2012.1.322의 현재 버전을 사용하여".

Answer 1

업데이트 대답이

현재 KendoUI 그리드 프레임 워크는 코드의 열을 전환 할 수있는 기능을 지원하지 않습니다. 모든 스위치 케이스에서 열을 완전히 재정렬 할 필요가없는 새로운 바이올린을 만들었습니다. 이 함수는 열 정의를 반복하며 드롭 다운 값이 있으면 배열에서 제거하고 첫 번째 위치에 배치합니다. 50 열 8 드롭 다운이 어떻게 상호 작용하는지 모르겠으므로 완전히 정확한 답을 제공하기가 어렵습니다. 하지만 여기에 여러 제안 사이에, 나는 당신이 솔루션에 올 수 있기를 바랍니다 :)

원래 열 정의가 원래 상태로 계속 사용할 수 있도록 새 tempColumn 정의 변수를 만들었습니다.

function onSelect(e) { 
    var ddlVal = this.dataItem(e.item.index()).value; 
    var tempColumns = columnDefinitions; 

    $(tempColumns).each(function(index) { 
     if (ddlVal == this.title) { 
      tempColumns.splice(index, 1); 
      tempColumns.splice(0, 0, this); 
     } 
    }); 

    createGrid(tempColumns); 

} 내가 검도의 현재 버전의 새로운 바이올린을 만들었습니다

New fiddle which uses spice to re-order the columns

업데이트 대답. Kendo 프레임 워크에서이 작업을 수행 할 방법이 없다고 생각하기 때문에 버전을 업데이트 할 필요가 없습니다.

이 솔루션은 드롭 다운에서 선택하고 그리드를 다시 작성할 때 열 정의를 다시 정의합니다.

Updated fiddle with your current version of Kendo

는 어떤 이유로, Internet Explorer가 때때로 jsfiddle 좋은 재생되지 않습니다 *. 이 예제는 Firefox와 Chrome에서는 작동하지만 IE에서는 작동하지 않습니다. 다른 브라우저에서 작동하는지 확인할 수 없다면 솔루션에 코드를 연결하고 테스트하십시오.

나는 2 개 개의 다른 솔루션을 제공 한

원래 대답.

1) KendoUI 버전을 업데이트 할 수 있습니까? 가능한 경우 .showColumn() 및 .hideColumn() 메서드를 활용할 수 있습니다.

다음은 KendoUI 2012.2.710을 사용한 다음과 같은 바이올린입니다. 드롭 다운의 select 이벤트에서 적절한 열을 표시하거나 숨 깁니다. 정말 쉽고 똑바로. 당신이 당신의 KendoUI 버전을 업데이트 할 수없는 경우

Fiddle using Kendo 2012.2.710

2), 당신은 그리드를 다시 만들기 다음 columnDefinition 배열을 변경할 수 있습니다.

드롭 다운 목록의 onSelect 메서드에서 columnDefinition 배열의 첫 번째 열을 제거한 다음 새 열 개체를 배열에 추가합니다. 그런 다음 그리드의 div 요소의 내용을 제거한 다음 그리드를 다시 작성합니다.

데이터를 다시 가져 오기 위해 전선을 돌아갈 필요가 없으므로 동일한 데이터에 바인딩되어 있습니다. 두 경우 모두

Fiddle using your current version of Kendo 2012.1.322

~, 코드가 확실히 더 나은 사용자의 요구에 맞게 정리 될 수 있지만, 난 그냥 당신이 함께 작동하는 몇 가지 기본 기능을 제공하고 싶었다. 희망이 도움이!