Javascript jqGrid-onClickButton将单元格值替换为工具提示值,反之亦然

Javascript jqGrid-onClickButton将单元格值替换为工具提示值,反之亦然,javascript,jquery,jqgrid,tooltip,Javascript,Jquery,Jqgrid,Tooltip,我已经设置了一个自定义按钮,我希望单击事件将单元格值的值替换为该特定单元格工具提示值的值。再次单击该按钮可将更改反转为正常 这有可能吗 网格看起来像 $("#grid").jqGrid({ url: "/Controller/ActionMethod", datatype: 'json', mtype: 'Get', //postData: { mId: getParameterByName('mId') }, co

我已经设置了一个自定义按钮,我希望单击事件将单元格值的值替换为该特定单元格工具提示值的值。再次单击该按钮可将更改反转为正常

这有可能吗

网格看起来像

$("#grid").jqGrid({
        url: "/Controller/ActionMethod",
        datatype: 'json',
        mtype: 'Get',
        //postData: { mId: getParameterByName('mId') },
        colNames: [Id', 'M-Val', Date' 'H1', 'H2', 'H3'],
        colModel: [
            { key: true, name: 'Id', index: 'Id', editable: true },
            { key: false, name: 'M-Val', index: 'M-Val', editable: true },
            {
                key: false, name: 'DateField', index: 'DateField', editable: true, formatter: 'date', width: 150,
                formatoptions: { srcFormat: 'ISO8601Long', newformat: 'd/m/Y ' }, searchoptions: { sopt: ['eq', 'ne', 'lt', 'gt'] }
            },
            { key: false, name: 'H1', index: 'H1', editable: true, width: 60, formatter: colorCode, cellattr: colorCodeCell },
            { key: false, name: 'H2', index: 'H2', editable: true, width: 60, formatter: colorCode, cellattr: colorCodeCell },
            { key: false, name: 'H3', index: 'H3', editable: true, width: 60, formatter: colorCode, cellattr: colorCodeCell },        ],
        pager: jQuery('#pager'),
        rowNum: 10,
        rowList: [10, 20, 30, 40],
        height: '100%',
        viewrecords: true,
        caption: '',
        emptyrecords: 'No records to display',
        jsonReader: {
            root: "rows",
            page: "page",
            total: "total",
            records: "records",
            repeatitems: false,
            Id: "0"
        },
        autowidth: true,
        shrinkToFit: false,
        multiselect: false
    }).navGrid('#pager', { edit: false, add: false, del: false, search: true, refresh: true }, {}, {}, {}, { multipleSearch: true, searchOnEnter: true, closeOnEscape: true }, {})
        //Button to view Tiers
        .jqGrid('navButtonAdd', '#pager', {
            caption: "", buttonicon: "ui-icon-info",
            onClickButton: function () {
                //TODO:
            }, position: "last", title: "View Tier Info", cursor: "pointer"
        });
    //$("#grid").jqGrid('groupingGroupBy', ['Id', 'M-Val', 'DateField']);
});

只是演示一下你的意思:

document.querySelector(“.swap”).addEventListener(“单击”,函数(){
var element=this.parentElement.parentElement.children[0];//td
var tooltip=element.title;
var content=element.textContent;
//交换值
element.title=内容;
element.textContent=工具提示;
},false)

常客

通过以下方式解决:

.jqGrid('navButtonAdd', '#pager', {
        caption: "", buttonicon: "ui-icon-info",
        onClickButton: function () {

            var grid = jQuery("#grid"), rows = grid[0].rows, cRows = rows.length,
            iRow, rowId, row, cellsOfRow;

            for (iRow = 0; iRow < cRows; iRow++) {
                row = rows[iRow];
                if ($(row).hasClass("jqgrow")) {
                    cellsOfRow = row.cells;

                    for (var i = 0; i < cellsOfRow.length; i++) {
                        var title = cellsOfRow[i].title;
                        var innerHTML = cellsOfRow[i].innerHTML
                        cellsOfRow[i].innerHTML = title;
                        cellsOfRow[i].title = innerHTML;
                    }
                }
            }

        }, position: "last", title: "View Info", cursor: "pointer"
    });
.jqGrid('navbuttonad','#pager'{
标题:,按钮图标:“用户界面图标信息”,
onclick按钮:函数(){
var grid=jQuery(“#grid”),rows=grid[0]。rows,cRows=rows.length,
iRow、rowId、row、cellsOfRow;
对于(iRow=0;iRow
现在,每当我单击指定的按钮时,单元格标题值和InnerHTMLDOM值都会交换

行单元格迭代的代码段是从 .


希望这对其他人有帮助

是的。你有密码吗?像这样的问题往往会很快被否决并被删除。是的,我会在一分钟内更新问题。你们有小提琴或我可以测试的东西吗?以不同的方式解决了它,但谢谢你们的帮助。这为我提供了一个很好的起点+很高兴我的代码为你的答案提供了基础。很高兴看到人们自己创造答案。最好的学习方式+1.@Mouser绝对同意,100%同意。再次感谢!