2012-02-20 2 views
0

treegrid의 jqgrid에서 expandColumn : 'name'열의 셀에 표시된 값을 클릭하여 편집하면 셀의 내용에 대한 html이 표시됩니다.jqgrid의 treegrid 확장 열의 모든 필드를 편집하는 중 실제 값이 아닌 해당 셀의 HTML 내용을 가져 오는 중입니다. 어떤 해결책?

내가 얻을 HTML 내용은 다음과 같습니다 -

<div class="tree-wrap tree-wrap-ltr" style="width: 54px;"><div style="left: 36px;" class="ui-icon ui-icon-radio-off tree-leaf treeclick"></div></div><span class="cell-wrapperleaf">Sub-subtask1</span> 

내 실제 값은 비록 - 하위 subtask1

내 그리드 설정

은 다음과 같습니다 : -

jQuery("#tree").jqGrid({ 
     url:'json/jsonSamplePots.json', 
     datatype: "json", 
     mtype:'GET', 
     colNames: ["id", "no.", "name", "col1", "col2", "col3", "col4", "col5", "col6", "col7", "col8", "col9", "col10", "col11", "col12", "col13", "col14", "col15", "col16"], 
     colModel: [ 
      {name:'id',width: 30, editable:false, align:"right",sortable:false, hidden: true, key: true}, 
      {name:'no',width:80, editable:false, align:"left", sortable:true, sorttype:"int"}, 
      {name:'name', width:150, editable:true, sortable:true, sorttype:"text"}, 
      {name:'col1', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
      {name:'col2', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
      {name:'col3', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
      {name:'col4', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
      {name:'col5', width:80, editable:false, align:"right", sortable:true, hidden: true, sorttype:"date"}, 
      {name:'col6', width:80, editable:false, align:"right", sortable:true, hidden: true, sorttype:"date"}, 
      {name:'col7', width:80, editable:false, align:"right", sortable:true, hidden: true, sorttype:"int"}, 
      {name:'col8', width:80, editable:false, align:"right", sortable:true, hidden: true, sorttype:"date"}, 
      {name:'col9', width:80, editable:false, align:"right", sortable:true, hidden: true, sorttype:"date"}, 
      {name:'col10', width:80, editable:false, align:"right", sortable:true, hidden: true, sorttype:"int"}, 
      {name:'col11', width:120, editable:true, align:"left", sortable:true, sorttype:"text"}, 
      {name:'col12', width:80, editable:true, align:"left", sortable:true, sorttype:"text"}, 
      {name:'col13', width:80, editable:true, align:"right", sortable:true, hidden: true, sorttype:"text"}, 
      {name:'col14', width:80, editable:false, align:"right", sortable:true, hidden: true, sorttype:"text"}, 
      {name:'col15', width:300, editable:true, align:"left", sortable:true, sorttype:"int"}, 
      {name:'col16', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
     ], 
     rowNum:10, 
     rowList:[10,20,30], 
     treeGridModel:'adjacency', 
     treeGrid: true, 
     cellEdit: true, 
     ExpandColumn:'name', 
     cellsubmit : 'clientArray', 

}); 

답변

0

getRowData를 사용하여 셀의 값을 가져 오는 것 같습니다. 셀이 편집 모드에 있으면 getRowData는 실제 값이 아닌 셀의 HTML을 리턴합니다. 셀을 편집 모드로 전환하기 전에 getRowData를 호출해야합니다.

beforeSelectRow 이벤트를 사용하여 행의 데이터를 편집 모드로 렌더링하기 전에 캐싱하려고 할 수 있습니다.

+0

셀 값을 얻기 위해 명시적인 함수를 사용하고 있지 않습니다. 셀 편집이 참일 때 셀을 클릭하면 해당 값이 표시됩니다. 그래서 저에게 셀이 편집 모드에있을 때이 값은 html 내용으로 올 것입니다. 한 가지 더, 이것은 열 이름의 셀 (확장 열)에 대해서만 발생합니다. – mayur

+0

흠, 나는 내 범위의 jqGrid 지식을 다 써 버렸다. 나는 나무 그루터기를 너무 많이하지 않았다. 다른 사람들이 http://www.javascripthtmlcss.com/javascript/put-your-code-in-a-test-tube-and-collaborate/와 공동 작업 할 수 있도록 jsfiddle에서 그리드를 설정하면 답변을 얻을 수 있습니다. . –

+0

@Oleg :이 호에 도움주세요 ... !! – mayur

1

cell editing 대신 inline editing을 사용해야합니다. TreeGrid를 셀 편집과 함께 사용할 수 없거나 적어도 ExpandColumn에 선언 한 '이름'열을 편집 할 수는 없습니다.

+0

당신이 맞습니다 !! 클라이언트 요구 사항을 기반으로하지만, 내가 treegrid와 셀 편집을 갔다. 이제 작동하지 않으므로 "afterSaveCell"이벤트에서 "treeclick"클래스가있는 요소의 click 이벤트를 첨부하려고했습니다. 몇 가지 경우에는 이렇게 작동하지만, 때로는 그렇지 않을 수도 있습니다. 여기에서 주요 문제는 입력 텍스트 상자에 html 콘텐츠가 아니지만 셀을 편집 한 후 click 이벤트가 "plus"이미지에 대해 작동하지 않습니다. – mayur

+0

그것은 내가 쓴 것입니다. 예를 들어 [대답] (http://stackoverflow.com/a/9482049/315935)의 [데모] (http://www.ok-soft-gmbh.com/jqGrid/LocalAdjacencyTree11_.htm)를 참조하십시오. 셀 편집은 'ExpandColumn'열의 열과 올바르지 않습니다. – Oleg

+0

링크 주셔서 감사합니다 !! 그렇다면 jqgrid 나 버그의 한계는 무엇입니까 ?? 다시 클릭 이벤트를 이미지에 다시 붙여서 해결할 수는 없습니다 .. !! – mayur