2012-04-13 3 views
3

특히 "subgrid로 그리드"가 아닌 단순한 서브 그리드입니다.jqGrid 서브 그리드에서 헤더 정렬을 어떻게 설정합니까?

다양한 방법을 시도했지만 아무 것도 작동하지 않습니다.

subGridBeforeExpand에 연결하면 테이블이 머리글을 선택하고 CSS를 설정할 준비가되지 않습니다.

subGridRowExpanded에 연결하면 subGrid도 렌더링되지 않습니다.

subGridModelalign 속성은 셀 값에만 영향을줍니다. Subgrids 및 Treegrids에 너무 적은 콜백이 있다는 것을,

subGrid: true, 
subGridUrl: myUrl,      
subGridModel: [{ 
    name: ["Item", "Qty"], 
    width: ["200", "100"], 
    align: ["right", "right"], 
    param: ["Id"] 
}] 

답변

2

자네 말이 맞아 :

여기 참조를 위해 내 모델입니다. 그럼에도 불구하고 나는 당신의 질문을 매우 흥미로운 도전 (+1)으로 발견했기 때문에 해결 방법이 발견되었습니다.

다음을 수행 할 수 있습니다 :

enter image description here

+0

평상시처럼 올레그가 구조했습니다. 감사! – IronicMuffin

+0

@IronicMuffin : 안녕하세요. – Oleg

0

가 나는 CSS 선택기로 해결했습니다

var $grid = $("#grid"), sid; 
$grid.jqGrid({ 
    //... your other settings 
    subGrid: true, 
    serializeSubGridData: function(p) { 
     sid = p.id; // save id from the last request 
     return p; 
    }, 
    ajaxSubgridOptions: { 
     complete: function (sxml) { 
      var ts = $grid[0], $subgridHeaders; 
      if (ts.p.subgridtype === "xml") { 
       ts.subGridXml (sxml.responseXML, sid); 
      } else { 
       ts.subGridJson($.jgrid.parse(sxml.responseText), sid); 
      } 
      // now the subgrid is completed and we can modify 
      // style of subgrid headers 
      $subgridHeaders = $('#' + $.jgrid.jqID(ts.id + '_' + sid)) 
       .find("th.ui-th-subgrid"); 
      // now we can do some custom actions: 
      $($subgridHeaders[0]).css("text-align", "left"); 
      $($subgridHeaders[1]).css("text-align", "right"); 
     } 
    } 
}); 

당신은 subgrids의 압축을 풀고 다음과 같습니다 데모를 here 수 있습니다 예를 들어 7 번째 열 머리글을 가운데에 맞 춥니 다.

#GRIDID .subgrid-data th:first-child + th + th + th + th + th + th 
{ 
    text-align: center; 
} 

또는 가운데 열 전체를 중심으로 :

#GRIDID .subgrid-data th:first-child + th + th + th + th + th + th, 
#GRIDID .subgrid-data td:first-child + td + td + td + td + td + td 
{ 
    text-align: center; 
} 
관련 문제