Is refreshCM sufficient for grid colModel custom state save and load?

[omerix]

Hello,

I have implemented custom functions to save and load only the column order (order), visibility (hidden), and width (width). Below are my simplified customSaveState and customLoadState functions:

My question is: After setting the new colModel, is calling only grid.refreshCM() (Only:order, width, hidden properties) sufficient to apply these changes? Or should I also call grid.refresh() or another method?

I load this layout in the "create" command like this:

Code: [Select]

        create: function () {
            //this.loadState({ refresh: false })
            customLoadState(this, "isim1");
        },


Code: [Select]

function customSaveState(grid, key) {
    function simplifyColModel(colModel) {
        return colModel.map(col => {
            const simplified = {
                dataIndx: col.dataIndx
            };
            if (col.width != null) simplified.width = col.width;
            if (col.hidden != null) simplified.hidden = col.hidden;
            if (col.colModel) simplified.colModel = simplifyColModel(col.colModel);
            return simplified;
        });
    }

    const simpleState = simplifyColModel(grid.option("colModel"));
const state=JSON.stringify(simpleState);
    localStorage.setItem(key, state);
    console.log("Custom state saved to localStorage under key:", key);
}


function customLoadState(grid, key) {
    const saved = localStorage.getItem(key);
    if (!saved) {
        console.warn("No saved state found for key:", key);
        return;
    }

function reorderAndMerge(savedModel = [], originalModel = []) {
        const originalMap = {};
        originalModel.forEach(orig => {
            originalMap[orig.dataIndx] = orig;
        });

        const handled = new Set();
        const result = [];

        // savedModel
        for (const saved of savedModel) {
            const orig = originalMap[saved.dataIndx];
            if (!orig) continue;

            const merged = { ...orig };

            if (saved.width != null) merged.width = saved.width;
            if (saved.hidden != null) merged.hidden = saved.hidden;

            // nested colModel
            if (saved.colModel && orig.colModel) {
                merged.colModel = reorderAndMerge(saved.colModel, orig.colModel);
            }

            result.push(merged);
            handled.add(saved.dataIndx);
        }

        // savedModel newColumn
        for (const orig of originalModel) {
            if (handled.has(orig.dataIndx)) continue;

            const merged = { ...orig };

            if (orig.colModel) {
                merged.colModel = reorderAndMerge([], orig.colModel);
            }

            result.push(merged);
        }

        return result;
    }


    const savedCols = JSON.parse(localStorage.getItem("isim1") || "[]");
    const currentCols = grid.option("colModel");
    const updated = reorderAndMerge(savedCols, currentCols);
    console.log(currentCols);
    grid.option("colModel", updated);
    grid.refreshCM();
    //grid.refresh();
    console.log("Custom state loaded from localStorage:", key);
}


[paramvir]

refresh() is required after refreshCM() to see the new colModel in view.

PS: There are inbuilt options to control the save and load state properties.

https://paramquery.com/pro/api#option-stateColKeys

https://paramquery.com/pro/api#option-stateKeys