setCell이 잘못된 셀을 업데이트합니다.

Question

HTML 코드를 반환하는 포맷터를 사용하여 셀 내에 작은 테이블 (HTML 테이블)을 정의하려고합니다. 콘텐츠는 동일한 레코드의 일부 숨겨진 필드를 기반으로합니다.

셀 내의 초기 설정은 잘 진행되고 있습니다. 문제는 나중에 "setCell"을 사용하여 숨겨진 필드를 수정하고 테이블 구조로 필드에 미치는 영향을 확인한다는 것입니다.

jqGrid가 WRONG 셀에 접근하여 일부 혼란을 일으키는 경우가 있습니다. 나는 그것을 증명할 jsFiddle을 만들었습니다.

jFiddle Example

당신이 볼 수 있듯이

<table id="grid"></table> 
<div> 
<input id="update" type="button" value="Update"> 
</div> 

var mydata = [{ 
    id: 1, 
    hiddenA: 1, 
    hiddenB: 2, 
    hiddenC: 4, 
    hiddenD: 8, 
    hiddenE: 16, 
    hiddenF: 32, 
    hiddenG: 64, 
    hiddenH: 128 
}]; 

$("#grid").jqGrid({ 
    datatype: "local", 
    data: mydata, 
    height: 250, 
    colNames: [ 
    'id', 
    'hiddenA', 
    'hiddenB', 
    'hiddenC', 
    'hiddenD', 
    'hiddenE', 
    'hiddenF', 
    'hiddenG', 
    'hiddenH', 
    'visibleA', 
    'visibleB' 
    ], 
    colModel: [ 
    {name: 'id', hidden: true, key: true}, 
    {name: 'hiddenA', hidden: true, width: 50}, 
    {name: 'hiddenB', hidden: true, width: 50}, 
    {name: 'hiddenC', hidden: true, width: 50}, 
    {name: 'hiddenD', hidden: true, width: 50}, 
    {name: 'hiddenE', hidden: true, width: 50}, 
    {name: 'hiddenF', hidden: true, width: 50}, 
    {name: 'hiddenG', hidden: true, width: 50}, 
    {name: 'hiddenH', hidden: true, width: 50}, 
    {name: 'visibleA', width: 80, formatter: addFormatter}, 
    {name: 'visibleB', width: 80, formatter: subFormatter} 
    ], 
    caption: "Table within a cell", 
    gridview: true, 
    loadonce: true, 
    viewrecords: true, 
    loadui: "disable", 
}); 

function addFormatter(cellvalue, options, rowObject) { 
    var ret = " \ 
    <table class='details-table'> \ 
    <tr><td>A+B:</td><td class='al-right'>{0}</td></tr> \ 
    <tr><td>B+C:</td><td class='al-right'>{1}</td></tr> \ 
    <tr><td>C+D:</td><td class='al-right'>{2}</td></tr> \ 
    <tr><td>D+A:</td><td class='al-right'>{3}</td></tr> \ 
    </table> \ 
    "; 
    ret = ret.replace("{0}", rowObject.hiddenA + rowObject.hiddenB); 
    ret = ret.replace("{1}", rowObject.hiddenB + rowObject.hiddenC); 
    ret = ret.replace("{2}", rowObject.hiddenC + rowObject.hiddenD); 
    ret = ret.replace("{3}", rowObject.hiddenD + rowObject.hiddenA); 

    return (ret); 
} 

function subFormatter(cellvalue, options, rowObject) { 
    var ret = " \ 
    <table class='details-table'> \ 
    <tr><td>E-F:</td><td class='al-right'>{0}</td></tr> \ 
    <tr><td>F-G:</td><td class='al-right'>{1}</td></tr> \ 
    <tr><td>G-H:</td><td class='al-right'>{2}</td></tr> \ 
    <tr><td>H-A:</td><td class='al-right'>{3}</td></tr> \ 
    </table> \ 
    "; 
    ret = ret.replace("{0}", rowObject.hiddenE - rowObject.hiddenF); 
    ret = ret.replace("{1}", rowObject.hiddenF - rowObject.hiddenG); 
    ret = ret.replace("{2}", rowObject.hiddenG - rowObject.hiddenH); 
    ret = ret.replace("{3}", rowObject.hiddenH - rowObject.hiddenE); 

    return (ret); 
} 

$("#update").bind("click", function() { 
    $("#grid").jqGrid("setCell", 1, "hiddenE", 256); 
    $("#grid").jqGrid("setCell", 1, "visibleB", "1"); 
}); 

는 "업데이트"버튼을 눌러 "hiddenE"필드를 변경 한 후 바로 업데이 트의 원인은 "visibleB"필드 접촉. 그러나 실제로는 "visibleA"필드가 수정되고 파괴된다는 것입니다.

아이디어가 있으십니까?

Answer 1

사용중인 버전 4.6의 버그입니다. 문제는 setCell 메서드에서 업데이트하려는 셀 안의 테이블 셀의 경우입니다.

우리가 지원하는 구릿도 jqGrid에서도 동일한 문제가 지속됩니다. 우리는 GitHub에서 문제를 해결했으며 Guriddo jqGrid 제품을 사용하려는 경우이를 테스트 할 수 있습니다.

어떤 경우에는 다른 jqGrid 복제 제품으로 업그레이드 할 수없는 경우가 있습니다. 그 이유는이 "오래된"jqGrid 제품을 사용하지 마십시오.

자바 스크립트에 익숙하지 않은 경우 4.6 jqGrid 코드를 수정하여 사용하면됩니다.이 목적으로 jquery.jqGrid.js 파일 (축소되지 않은 파일)을 열고 setCell 메소드를 찾아야합니다. 라인 3646. 주위의 표현을

var tcell = $("td:eq("+pos+")",ind); 

을 찾은 다음이 파일을 작게를하고 사용할 수 있습니다

var tcell = ind.cells[pos]; 

로 교체하십시오.

이 경우 당신은 당신이 지원되는있는 jqGrid 클론 중 하나를 업그레이드 할 수 있습니다이 작업을 수행 할 수없는 경우 - 무료있는 jqGrid 또는 상업적 Guriddo있는 jqGrid