2016-12-14 3 views
0

다음과 같은 것을 알고 있습니다. http://docs.telerik.com/kendo-ui/api/javascript/ui/gantt#configuration-editable.template 하지만 필요한 것은 아닙니다.검도 UI Gantt - 작업 업데이트를위한 사용자 지정 모달 표시

기본 검도 대화 상자 대신 앱의 다른 부분에서 사용되는 작업 편집 용 사용자 지정 모달 대화 상자를 표시해야합니다.

가 편집 이벤트에 대한 처리기를 구현하고 검도의 처리 내장을 취소 e.preventDefault()를 사용 :

+0

이것이 사용자가 같은 모달입니까? 템플릿 정의를 사용자 정의 모달의 마크 업과 동일하게 만들 수 없습니까? –

+0

작업을 편집하기 위해 기본 검도 대화 상자에서 유효성 검사 시작 및 종료를 비활성화 할 수있는 방법을 알고 계십니까? –

답변

2

여기 가능한 방법입니다. 이렇게하면 대화 상자 (또는 템플릿)가 표시되지 않습니다.

이제 자신 만의 대화 상자를 표시하고 (이를 수행해야 함) 편집 이벤트에 전달 된 GanttTask 데이터를 푸시합니다.

대화 상자가 닫히면 편집 된 데이터의 값을 GanttTask로 밀어 넣습니다. 중요합니다! 기본 제공 기능을 취소 했으므로 의 기본 데이터 모델을 업데이트해야합니다.

예 편집 핸들러 :

edit: function(e) { 
    // Cancel the built-in editing functionality 
    e.preventDefault(); 
    var editResult = showMyDialog(e.task); 
    if (editResult.ok) { 
     // User clicked OK instead of Cancel...or whatever mechanism your dialog uses. 
     e.task.set("title", editResult.data.title); 
     // other data... 
    } 
} 

예 사용자 정의 대화 :

function showMyDialog(task) { 
    // Fetch/show your actual window, push in the data from the GanttTask 
    alert("This is my window: " + task.title); 

    // Simulate user editing of GanttTask. 
    var editedTitle = "NeW tAsK!"; 
    // other data... 

    return { 
     ok: true, // or false if user clicked cancel. 
     data: { 
     title: editedTitle 
     // other data... 
     } 
    }; 
    } 

간단한 데모 : http://dojo.telerik.com/@Stephen/apEYa

+0

고마워, 잘됐다! –