Thanks for advice 

Works like a glove

Hi,
I would like to add a button that allows the rows to be swapped up and down. I found a post from 2014, but it doesn't work

https://www.jeasyui.com/forum/index.php?topic=3634.0

Snippet of the code

Code:

function dgSwapColumns(from, to) {
      $('#dg).datagrid('moveRow', { from: from, to: to });
}

It gives me this error

Code:

Uncaught TypeError: $.fn.datagrid.methods[_8ee] is not a function
    at $.fn.datagrid (<anonymous>:12356:35)
    at dgSwapColumns ((index):89:30)
    at HTMLAnchorElement.onclick ((index):1:1)

Has anyone encountered such a situation? It works very well on a computer, but if the page is loaded on a tablet/phone it doesn't work so well, it's even hard to work with. For example datagrid, messager is very slow

JSONfn comes with the answer

Code:

$('#datagrid').datagrid({ columns: [JSONfn.parse(JSONfn.stringify(columns))] });

Hi,
How could I solve my problem? I tried eval(); and (function() {})();

Code

Code:

function refreshDatagrid() {
    const columns = $('#datalist').datalist('getRows');
    $('#datagrid').datagrid({ columns: [columns] });
}

Data

Code:

[
    {
        "field": "field_fdqzv",
        "title": "title"
    },
    {
        "field": "field_2agdu",
        "title": "2agdu",
        "_selected": true,
        "width": 200,
        "align": "center",
        "formatter": "function (value, row, index) {\n\treturn value + ' ' + index;\n}",
        "styler": ""
    }
]

Ok, i found it. I needed also title, field was not enough.

Hi,
Am having a problem w drag and drop on my Datagrid

Code:

Uncaught TypeError: Cannot read properties of undefined (reading 'jQuery3310090322002266437942')
    at Q.get (jquery.min.js:2:32502)
    at Q.access (jquery.min.js:2:32622)
    at Function.data (jquery.min.js:2:33477)
    at Object.options (jquery.easyui.min.js:12493:12)
    at $.fn.datagrid (jquery.easyui.min.js:12356:35)
    at getDraggingRow (datagrid-dnd.js:390:27)
    at HTMLTableRowElement.onBeforeDrag (datagrid-dnd.js:152:25)
    at HTMLTableRowElement.<anonymous> (jquery.easyui.min.js:638:21)
    at HTMLTableRowElement.dispatch (jquery.min.js:2:41772)
    at y.handle (jquery.min.js:2:39791)

And also is there a way to import drag and drop to datalist?

Code:

inputEvents: {
            keydown: function (e) {
                if (e.keyCode === 9) {
                    e.preventDefault();
                    const val = this.value, start = this.selectionStart, end = this.selectionEnd;
                    this.value = val.substring(0, start) + '\t' + val.substring(end);
                    this.selectionStart = this.selectionEnd = start + 1;
                }
            }
        }

Hi,
How can I disable moving to next input field in form by clicking tab and making '\t' in text field.

Maybe there is a bug in my function?

Code:

function saveInfo() {
    if (!($('#form').form('validate'))) {
        return;
    }
    const formData = $('#form').serializeArray();
    if (fieldIdx >= 0) {
        const clickedField = $('#datalist').datalist('getRows')[fieldIdx];
        formData.forEach(e => {
            clickedField[e.name] = e.value;
        });
        $('#datalist').datalist('updateRow', { index: fieldIdx, row: clickedField }).datalist('refreshRow', fieldIdx);
    }
    $('#win').window('close');
}

After usage updateRow it needs to use refreshRow.

Code:

$('#dl').datalist('updateRow', { index: idx, row: row}).datalist('refreshRow', idx);

I got back into my project and found I think the simplest solution 

Code:

(function ($) {
        function buildMenu(target) {
            const state = $(target).data("datagrid");
            if (!state.columnMenu) {
                state.columnMenu = $("<div></div>").appendTo("body");
                state.columnMenu.menu({
                    onClick: function (item) {
                        if (item.iconCls == "tree-checkbox1") {
                            $(target).datagrid("hideColumn", item.name);
                            $(this).menu("setIcon", {
                                target: item.target,
                                iconCls: "tree-checkbox0"
                            });
                        } else {
                            $(target).datagrid("showColumn", item.name);
                            $(this).menu("setIcon", {
                                target: item.target,
                                iconCls: "tree-checkbox1"
                            });
                        }
                        $(state.columnMenu).show(); // HERE
                    }
                })
                const fields = $(target).datagrid("getColumnFields", true).concat($(target).datagrid("getColumnFields", false));
                for (var i = 0; i < fields.length; i++) {
                    var field = fields[i];
                    var col = $(target).datagrid("getColumnOption", field);
                    if (col.hidden) {
                        state.columnMenu.menu("appendItem", {
                            text: col.title,
                            name: field,
                            iconCls: "tree-checkbox0"
                        });
                    } else {
                        state.columnMenu.menu("appendItem", {
                            text: col.title,
                            name: field,
                            iconCls: "tree-checkbox1"
                        });
                    }
                }
            }
            return state.columnMenu;
        }
        $.extend($.fn.datagrid.methods, {
            columnMenu: function (jq) {
                return buildMenu(jq[0]);
            }
        });
    })(jQuery);

After iteration over the items

Code:

items.forEach(el => {
    delete el.id;
    delete el.children;
});

Works as it should
Thanks!

Hi,
Is there a way to export a datagrid to XLSX not to XLS?
Why does it show that the file is in a different extension than XLS when I open it in Excel but the end of the file is XLS?

Regards

Have you got the solution for "Is it possible to avoid that the "Context Menu" closes after selecting/unselecting a checkbox ?" ?