jqGrid 서브 그리드에서 가로 스크롤 막대를 숨기는 방법은 무엇입니까?

Question

그래서 jqGrid에 약간의 디스플레이 문제가 있습니다. 버그, 당연하다고 주장 할 수는 없지만 사용자가 혼란 스럽기 때문에이를 처리하라는 요청을 받았습니다. 그러나 나보다 나은 것으로 보입니다.

부모 그리드 행을 확장하면 하위 그리드가로드되는 하위 그리드가 사용됩니다 (아래 코드 참조). 나는 전체 설정을 단순화하여 읽기 쉽도록했다. 대부분 하나의 컬럼을 제외한 모든 것을 제거하고 colModel을 단순하게 유지한다. 부모 그리드에는 화면에 없을 수도있는 데이터를보기 위해 오른쪽에서 왼쪽으로 스크롤 할 수있는 가로 스크롤 막대가 있습니다. 화면이 커서 모든 데이터를 표시 할 수있을만큼 커지면 부모 모눈의 가로 스크롤 막대가 사라집니다.

서브 그리드가로드 될 때 100 % 너비로로드됩니다. 부모 그리드가 확장되어 전체 하위 그리드가 표시되고 상위 그리드의 가로 스크롤 막대를 사용하여 모든 데이터를 앞뒤로 스크롤 할 수 있습니다. 표시되는 서브 그리드의 수 또는 개수에 관계없이 모든 수평 스크롤에 대해 하나의 스크롤 막대가 있습니다.

불행히도, 서브 그리드는 가로 스크롤 막대도 표시합니다. 그리드 폭이 100 %이기 때문에이 스크롤 막대는 아무 것도하지 않습니다. excet은 사용자가 더 이상 볼 데이터가 없다고 생각하도록 혼동합니다 그들은 그것을 사용하여 스크롤하고 아무 것도 움직이지 않을 때.

서브 그리드에서이 가로 스크롤 막대를 숨길 수있는 jqGrid 구성 또는 CSS "마법"을 통한 방법이 있습니까? Chrome 개발자 도구를 사용했지만 스크롤 막대, 제목, 헤더 및 데이터 행과 관련된 DIV 태그가없는 것 같습니다.

버전 :

• jQuery를   :           1.4.2
• jQueryUI   :     1.8.5
• 있는 jqGrid   :             3.8.1
• 브라우저   :   크롬 8, IE 8

jQuery(document).ready(function() { 
    jQuery('#ParentGrid').jqGrid({ 
     url: '[URL TO GET DATA]', 
     width: '100%', 
     height: '100%', 
     shrinkToFit: 'false', 
     datatype: 'json', 
     mtype: 'POST', 
     jsonReader: { repeatitems: false }, 
     sortname: 'ParentRowID', 
     sortorder: 'asc', 
     colNames: [ 
      'Parent Row ID' 
     ], 
     colModel: [ 
      { name: 'ParentRowID', index: 'ParentRowID', width: 110, align: 'left' } 
     ], 
     gridComplete: function() { 
      $('.ui-jqgrid-titlebar-close', '#ParentGrid').remove(); 
     },    
     subGrid: true, 
     subGridRowExpanded: function (subgrid_id, row_id) { 
      var subgrid_table_id = subgrid_id + '_t'; 
      $('#' + subgrid_id).html("<table id='" + subgrid_table_id + "' cellpadding='0' cellspacing='0'></table>"); 
      $('#' + subgrid_table_id).jqGrid({ 
       url: '[URL TO GET DATA BASED ON PARENT GRID SELECTED ROW ID]', 
       width: '100%', 
       height: '100%', 
       shrinkToFit: 'false', 
       datatype: 'json', 
       mtype: 'POST', 
       jsonReader: { repeatitems: false }, 
       sortname: 'ChildRowID', 
       sortorder: 'asc', 
       colNames: [ 
        'Child Row ID' 
       ], 
       colModel: [ 
        { name: 'ChildRowID', index: 'ChildRowID', width: 110, align: 'left' } 
       ], 
       gridComplete: function() { 
        $('.ui-jqgrid-titlebar-close', '#' + subgrid_table_id).remove(); 
       } 
      }); 
     } 
    }); 
}); 

Answer 1

는 페이지 매김을주고 세로 스크롤 막대가 제거 될 수 있도록 결과 그리드의 높이를 증가시킨다. 이렇게하면 수평 스크롤 막대도 제거됩니다.

Answer 2

나는 동일한 문제가 있고, 나는 css를 추가하여 그것을 해결했다. 다음과 같이 할 수 있습니다.

#ParentGrid .ui-jqgrid-bdiv{ 
     overflow-x:hidden; 
    }