如何刷新 w2ui 网格以呈现以编程方式更改的记录值？

Question

我正在使用 w2ui v1.5 并具有以下“设计”

Html:

<body>
<div id="myGrid" style="width:100%; height: 100vh"></div>
</body>

脚本：

w2ui.myGrid.on('change',(event)=>{

    if(event.value_new !== event.value_previous) {
        const previousNote = event.value_previous;
        const updatedNote = event.value_new;
        const customId = event.recid;

        $.ajax({
            url:`/stuff/${customId}`,
            type:'PUT',
            contentType:'application/json',
            data:JSON.stringify({
                previousNote,
                updatedNote,
            })
        }).done((data, textStatus, xhr) => {
            console.log('DONE--->',data,'status',textStatus,'xhr',xhr); //NOOP
        }).fail((xhr, textStatus, errorThrown)=>{
            conflictPopup(customId, xhr.responseJSON);
        });
    }
});

在弹出窗口中，我尝试在显示详细信息后恢复为旧值：

const conflictPopup = (customId, data) => {
  w2ui.myGrid.set(customId,{userNotes:data.previousNote}); //DOESN'T WORK

  w2popup.open({
    title: 'CONFLICT - STALE DATA',
    body: 'oops!',
    actions: {
        Ok(event) {
        //even this doesn't work
            w2popup.close();
            w2ui['myGrid'].set(customId,{userNotes: data.currentValue});
            w2ui['myGrid'].refresh();//(customId,'userNotes');
        }
    }
});
}

网格继续显示陈旧的数据。我什至尝试调用 w2ui.myGrid.refresh() 但无济于事。我什至尝试使用 w2ui.myGrid.refreshCell(customId,data.previousNote)，但即使那样也行不通。

调用 refresh 或手动触发事件的组合不会强制 UI 更新。如果我在控制台上执行 w2ui.myGrid.records，我会看到具有正确值 userNotes 的数据结构，但即使在控制台上调用该方法后网格似乎也没有刷新。我错过了什么？

Answer 1

经过一段时间的挣扎，我决定 event.preventDefault() 并在 ajax 回调中手动设置值。这似乎奏效了：

const updateUserNote = (recordId, note) => w2ui.myGrid.set(recordId,{userNotes:note});
 
w2ui.myGrid.on('change',(event)=>{

    if(event.value_new !== event.value_previous) {
        const previousNote = event.value_previous;
        const updatedNote = event.value_new;
        const customId = event.recid;

        $.ajax({
            url:`/stuff/${customId}`,
            type:'PUT',
            contentType:'application/json',
            data:JSON.stringify({
                previousNote,
                updatedNote,
            })
        }).done((data, textStatus, xhr) => {
            console.log('DONE--->',data,'status',textStatus,'xhr',xhr); 
            updateUserNote(customId,updatedNote); //manually set
        }).fail((xhr, textStatus, errorThrown)=>{
            conflictPopup(customId, xhr.responseJSON);
            updateUserNote(customId,xhr.responseJSON.newValue); //manually set
        });
    }
});

如何刷新 w2ui 网格以呈现以编程方式更改的记录值？

How to refresh w2ui grid to render a record value that is changed programmatically?

jquery

w2ui