2014-08-30 5 views
13

jquery 대화 상자 안에 검도 표 컨트롤이 있습니다. 대화 상자 모달이 참일 때를 제외하고는 잘 작동하지만 격자 필터에서 작업 할 수 없습니다. 대화 상자 모달이 거짓이면 완벽하게 작동합니다. 진정한 종류의 기능을 모달에 적용해야합니다.Kendo 모달 Jquery 대화 상자 (모달 포함)

enter image description here

JQuery와 대화 코드 : 여기

는 문제의 스냅 샷입니다

$('#dialog').dialog({ 
    title: 'Add Patient', 
    height: 'auto', 
    width: '95%', 
    position: ['top', 70], 
    draggable: false, 
    show: 'blind', 
    hide: 'blind', 
    modal: true, 
    resizable: false, 
    open: function (event, ui) { 
    var url='@Url.Action("AddPatient", "PatientManagement")'; 
    $(this).load(url); 
    }, 
    close: function (event, ui) { 
    $(this).html(''); 
    } 
}); 

검도 그리드 :

@(Html.Kendo().Grid<RxConnectEntities.Patient>().Name("PatientList") 
    .Columns(columns => 
    { 
    columns.Bound(p => p.PatientID).Visible(false); 
    columns.Bound(p => p.LastName).Width(100); 
    columns.Bound(p => p.FirstName).Width(100); 
    columns.Bound(p => p.Gender).Width(80); 
    columns.Bound(p => p.DateOfBirth).Width(90).Format("{0:MM/dd/yyyy}").EditorTemplateName("DateOfBirth"); 
    columns.Bound(p => p.PhoneNumber).Title("Phone Number").Width(110); 
    columns.Command(command => 
    { 
     command.Custom("Edit").Text("Edit").Click("EditGrid"); 
    }).Width(120); 
    }) 
    .Filterable(f=>f.Enabled(true)) 
    .Pageable(p => p.PageSizes(true)) 
    .Scrollable() 
    .Sortable() 
    .Groupable() 
    .DataSource(dataSource => dataSource 
    .Ajax().ServerOperation(false) 
    .PageSize(5) 
    .Model(m => m.Id(p => p.PatientID)) 
    .Read(read => read.Action("GetPatientList", "PatientManagement")) 
    .Destroy(delete => delete.Action("Deletepatient", "PatientManagement")) 
)) 
+0

콘솔 창에 오류 메시지가 있습니까? –

+0

@NicklasWinger 아니요. 오류는 없습니다. – Dhwani

+0

확인. 이것은 무작위적일 수도 있지만, 필자가 비슷한 문제를 가지고있는 마지막 순간에 그리드의 자바 스크립트 구현을 실제로 도왔다. 비록 직접적으로 '맵핑'을해야한다고 할지라도. –

답변

9

사용 KendoWindow 문서가 문제를 해결하는 것입니다. 예 : JQuery와 UI JS에서

$('#dialog').kendoWindow({ 
    title: 'Add Patient', 
    height: 'auto', 
    width: '95%', 
    position: ['top', 70], 
    draggable: false, 
    show: 'blind', 
    hide: 'blind', 
    modal: true, 
    resizable: false, 
    open: function (event, ui) { 
    var url='@Url.Action("AddPatient", "PatientManagement")'; 
    $(this).load(url); 
    }, 
    close: function (event, ui) { 
    $(this).html(''); 
    } 
}); 
0

, 당신은 단지

이 내 문제를 해결
enter code here 
this._delay(function() { 
       // Handle .dialog().dialog("close") (#4065) 
       if ($.ui.dialog.overlayInstances) { 
        this.document.bind("focusin.dialog", function(event){ 
         if (!that._allowInteraction(event)) { 
          event.preventDefault(); 
          $(".ui-dialog:visible:last .ui-dialog-content") 
           .data(widgetFullName)._focusTabbable(); 
         } 
        }); 
       } 
      }); 

, 당신의 필요로 변경하거나하려고 다음 코드를 찾으려고은 그것을

을 언급 내가 Kendo 드롭 다운리스트를 사용하여 시도했는데,

Jquery UI 대화 상자에서 kendo 드롭 다운 목록이 열리고 닫히기 때문에이 특정 코드 m 일어나는 akes.