jqGrid 위치 재 지정 삭제 확인 상자

Question

현재 navGrid에 jqGrid를 사용하고 있으며 del을 true로 설정하고 있습니다. 문제는 사용자가 삭제를 클릭하면 그리드의 왼쪽 상단에있는 확인 상자를 팝업합니다. 우리는 이미 맨 아래로 내려 갔기 때문에 큰 높이를 가졌으므로 사용자는 맨 위로 가서 확인해야합니다. 이 위치를 옮길 방법이 있습니까? 수동 오프셋은 괜찮지 만 이상적으로 왼쪽 상단에 고정 된 것처럼 왼쪽 하단에 고정시키고 싶습니다. 사전에

덕분에

(이 미안 속는 경우. 난 그냥 그것을 게시 시도하지만 나에게 몇 가지 이상한 오류를주고 내 역사에 표시되지 않도록이 게시되지 않은 가정.)

Answer 1

나는 속는 사람이 아냐. 반대로 나는 나에게서 좋은 +1을 찾는다.

jqGrid는 내부적으로 대부분의 대화 상자를 표시하는 viewModal ($.jgrid.viewModal) 메서드를 사용합니다. 메서드에 toTop 매개 변수가 있지만 delGridRow 및 editGridRow은 사용하지 않으며 toTop:true으로 설정됩니다. 그래서 Add, Edit, Delete 대화 상자는 항상 그리드의 상단에 표시됩니다. 그리드 상단은 inviable 영역 안에있을 수 있습니다.

대화 상자 위치를 변경하는 afterShowForm 이벤트 핸들을 정의하여 문제를 해결할 수 있습니다. 예 :

$("#list").jqGrid('navGrid','#pager', {}, {}, {}, 
        { 
         afterShowForm: function($form) { 
          var dialog = $form.closest('div.ui-jqdialog'), 
           selRowId = myGrid.jqGrid('getGridParam', 'selrow'), 
           selRowCoordinates = $('#'+selRowId).offset(); 
          dialog.offset(selRowCoordinates); 
         } 
        }); 

이 예제에서 대화 상자는 선택한 행 위에 배치됩니다. 마지막 줄의 선택된 행과 대화 상자의 아래쪽 부분이 창 밖에있을 때 코드를 향상시킬 수 있습니다. 그럼에도 불구하고 위의 구현은 사용자가 삭제하고자하는 행에 대해 정확히 대화 상자를 보았 기 때문에 대화 상자를 완전히 볼 수 있도록 이동할 수 있기 때문에 기본 대화 상자보다 나을 것 같습니다.

the live demo에서 삭제 대화 상자의 제안 된 동작을 테스트 할 수 있습니다.

Answer 2

더 나은 것을 발견했습니다. here!

자바 스크립트 라이브러리에이 추가

afterShowForm: function(form) { 
    form.closest('div.ui-jqdialog').center(); 
} 

form.closest ('div.ui-jqdialog') =

이

jQuery.fn.center = function() { 
    this.css("position","absolute"); 
    this.css("top", ($(window).height() - this.height())/2+$(window).scrollTop() + "px"); 
    this.css("left", ($(window).width() - this.width())/2+$(window).scrollLeft() + "px"); 
    return this; 
} 

지금 방금 afterShowForm 속성이를 추가 할 필요가 > 모달 팝업 창을 표시 할 수 있으며 editForm 또는 deleteForm 인 경우 정확한 표시가 필요하지 않습니다.

이 코드는 팝업을 화면 중앙에 배치하므로 실제로 큰 그리드가있는 경우 스크롤하지 않아도됩니다.