已封装工具

工具源码

下面的源码来自旭纸业

// 获取表格所有行
function getKendoGridAllRow(gridId){
    const kendoGrid = $(`#${gridId}`).data("kendoGrid");
    let rows = $(`#${gridId}`).data('kendoGrid').dataSource.data();
    let ret = [];
    $(rows).each(function(){
        ret.push(this);
    })

    return ret;
}

// 获取表格选中行 - 返回数组或者 null
function getKendoGridSelectedRowData(gridId){
    const kendoGrid = $(`#${gridId}`).data("kendoGrid");
    if( !kendoGrid ) return null;
    const selectedRows = kendoGrid.select();
    if( !selectedRows ) return null;

    let ret = [];
    let selected = Array.from(selectedRows);
    selected.forEach(ele => {
        let data = kendoGrid.dataItem(ele);
        ret.push(data);
    })

    return ret;
}

// 获取过滤后的所有数据
function getKendoGridFilterData(gridId){
    if(!gridId) {
        alert('没有传入表格ID');
        return;
    }
    let dataSource = $(`#${gridId}`).data('kendoGrid').dataSource;
    let filters = dataSource.filter();
    let allData = dataSource.data();
    let filterSource = new kendo.data.Query(allData);
    let filterData = filterSource.filter(filters).data;
    return filterData;
}

function copyRows(gridId){
    let selectedRows = $(`#${gridId}`).data('kendoGrid').select();

    if (!selectedRows) {
        msg("选中行后再执行本操作！")
        return
    }

    let codedString = "";
    selectedRows.each(function (index, item) {
        let dataItem = $(`#${gridId}`).data('kendoGrid').dataItem($(this));
        codedString = codedString + JSON.stringify(dataItem) + ",";
    })

    // 移除最后一个符号
    codedString = removeSuffix(codedString, ",");
    copyToClip(codedString);
    codedString.length > 0 ? $.messager.show({title: '提示', msg: '复制完毕！'}) : $.messager.show({
        title: '提示',
        msg: '复制了空白内容！'
    })
}

/**
 * 复制内容到粘贴板
 * content : 需要复制的内容
 * message : 复制完后的提示，不传则默认提示"复制成功"
 */
function copyToClip(content, message) {
    var aux = document.createElement("input");
    aux.setAttribute("value", content);
    document.body.appendChild(aux);
    aux.select();
    document.execCommand("copy");
    document.body.removeChild(aux);
    if (message == null) {
        // alert("复制成功");
    } else {
        alert(message);
    }
}

/**
 * 2021年7月4日 23:05:58
 * chanchaw
 * raw：传入原始字符串
 * suffix：字符串最后一个字符符合则删除后返回
 */
function removeSuffix(raw, suffix) {
    let str = raw.toString();
    let last = str.substr(str.length - 1, 1);
    if (last == suffix)
        str = str.substr(0, str.length - 1)
    return str;
}

// 将选中的行上移
// gridId: kendoGrid 的ID
// fileName：表格数据的主键字段名称
function moveUp(gridId,fieldName){
    moveRow(gridId,fieldName,-1);
}

function moveDown(gridId,fieldName){
    moveRow(gridId,fieldName,1);
}

function moveFirst(gridId,fieldName){
    moveRow(gridId,fieldName,2);
}

function moveLast(gridId,fieldName){
    moveRow(gridId,fieldName,3);
}

/**
 * 移动选中行
 * gridId 表格ID
 * fieldName 主键字段
 * direction -1=向上，1=向下，2=置顶，3=置底
 */
function moveRow(gridId,fieldName,direction){
    const kGrid = $(`#${gridId}`).data('kendoGrid');
    const kGridData = kGrid.dataSource.data();
    const selectedFirstRow = kGrid.select();
    const selectedFirstRowData = kGrid.dataItem(selectedFirstRow);

    const oldIndex = getRowIndex(kGridData,selectedFirstRowData,fieldName);// 获取选中行的 index
    const newIndex = getNewIndex(oldIndex,direction,kGridData.length);// 根据移动的方向计算新的 index
    if(isOutofRange(oldIndex,newIndex,kGridData.length,direction)) return;// 越界则不移动

    const deletedArray = kGridData.splice(oldIndex,1);
    kGridData.splice(newIndex,0,deletedArray[0]);

    kGrid.dataSource.data(kGridData);
    kGrid.select(`tr:eq(${newIndex})`);
}

function isOutofRange(oldIndex,newIndex,size,direction){
    const lastIndex = size - 1;
    if(newIndex <= -1 || newIndex >= size) return true;// 越界不做操作
    if(direction === -1 && oldIndex === 0) return true; // 原本就是首行，不可再向上移动
    if(direction === 1 && oldIndex === lastIndex) return true; // 原始是最后一行，不可再向下移动
    if(direction === 2 && oldIndex === 0) return true; // 原本是第一行，不可移动到首行
    if(direction === 3 && oldIndex === lastIndex) return true; // 原本是最后一行，不可移动到尾行
    return false;
}

/**
 * 返回移动后的新的行号  index
 * oldIndex 原 index
 * direction 移动方向：-1:向上移动，1：向下移动，2：移动到顶，3：移动到底
 * size 数组的大小
 */
function getNewIndex(oldIndex,direction,size){
    let newIndex = -1;
    switch (direction){
        case -1:
            newIndex = oldIndex - 1;// 小于等于-1为越界，不可移动
            break;
        case 1:
            newIndex = oldIndex + 1;// 超过数组大小为越界，不可移动
            break;
        case 2:
            newIndex = 0;
            break;
        case 3:
            newIndex = size - 1;
            break;
        default:
            return -1;
    }
    return newIndex;
}

/**
 * 返回行所在的 index，返回-1表示没有找到
 * gridData 表格数据数组
 * targetRow 目标行数据
 * fieldName 检测的字段名称
 */
function getRowIndex(gridData,targetRow,fieldName){
    let index = -1;
    for(let i=0;i < gridData.length;i++){
        if(gridData[i][fieldName] === targetRow[fieldName]){
            index = i;
            break;
        }
    }
    return index;
}

// 获取选中的多行的第一行的 rowIndex
function getSelectedRowIndex(gridId){
    let kGrid = $(`#${gridId}`).data('kendoGrid');
    const allRows = kGrid.items();
    const selectedRow = kGrid.select()[0];
    const selectedIndex = allRows.index(kGrid.select());
    console.log('选中的行：',selectedRow);
    console.log('选中行的rowIndex：',selectedIndex);
    return selectedIndex;
}

// 设置指定行为选中状态
function setRowSelected(gridId, rowIndex){
    let kGrid = $(`#${gridId}`).data('kendoGrid');
    if(rowIndex>=0){
        kGrid.select(`tr:eq(${rowIndex})`);
    }
}

获取 kendoGrid 表格所有行数据

传入表格 id 返回表格所有行的数据

function getKendoGridAllRowData(gridId){
    let rows = $(`#${gridId}`).data('kendoGrid').dataSource.data();
    let ret = [];
    rows.forEach(ele => {
        let data = kendoGrid.dataItem(ele);
        ret.push(data);
    })

    return ret;
}

获取 kendoGrid 选中行数据

传入表格 id 返回表格中选中行的数据

function getKendoGridSelectedRowData(gridId){
    const kendoGrid = $(`#${gridId}`).data("kendoGrid");
    if( !kendoGrid ) return null;
    const selectedRows = kendoGrid.select();
    if( !selectedRows ) return null;

    let ret = [];
    let selected = Array.from(selectedRows);
    selected.forEach(ele => {
        let data = kendoGrid.dataItem(ele);
        ret.push(data);
    })

    return ret;
}

获取过滤后的所有数据

function getKendoGridFilterData(gridId){
    if(!gridId) {
        alert('没有传入表格ID');
        return;
    }
    let dataSource = $(`#${gridId}`).data('kendoGrid').dataSource;
    let filters = dataSource.filter();
    let allData = dataSource.data();
    let filterSource = new kendo.data.Query(allData);
    let filterData = filterSource.filter(filters).data;
    return filterData;
}