当前位置:主页 > >

easyUI datagrid点击行单选、按shift或Ctrl点击行多选

时间:2020-05-16 08:52:43 | 栏目: | 点击:

对于datagrid操作,我们正常的操作是单选操作,就是一次点击只选中一行,需要多选的时候,再按shift或Ctrl。在easyui中怎么实现呢,请看本文介绍的方法。

singleSelect:true, //只允许选中一行
onClickRow(index, row) {
    //-------------for TEST 结合SHIFT,CTRL,ALT键实现单选或多选----------------
    if (index != selectIndexs.firstSelectRowIndex && !inputFlags.isShiftDown) {
      selectIndexs.firstSelectRowIndex = index; //alert('firstSelectRowIndex, sfhit = ' + index);
    }
    if (inputFlags.isShiftDown) {
      $('#baseOrderList').datagrid('clearSelections');
      selectIndexs.lastSelectRowIndex = index;
      var tempIndex = 0;
      if (selectIndexs.firstSelectRowIndex > selectIndexs.lastSelectRowIndex) {
        tempIndex = selectIndexs.firstSelectRowIndex;
        selectIndexs.firstSelectRowIndex = selectIndexs.lastSelectRowIndex;
        selectIndexs.lastSelectRowIndex = tempIndex;
      }
      for (var i = selectIndexs.firstSelectRowIndex; i <= selectIndexs.lastSelectRowIndex; i++) {
        $('#baseOrderList').datagrid('selectRow', i);
      }
    }
    //-------------for TEST 结合SHIFT,CTRL,ALT键实现单选或多选----------------
  }

html的页面body标签上添加:

onkeydown="javascript:keyPress(event);" onkeyup="javascript:keyRelease(event);"

最后在页面的script标签中中写入下述内容即可:

//     结合SHIFT,CTRL,ALT键实现单选或多选
  //-------------------------------------------------------------------------------
  var KEY = {SHIFT: 16, CTRL: 17, ALT: 18, DOWN: 40, RIGHT: 39, UP: 38, LEFT: 37};
  var selectIndexs = {firstSelectRowIndex: 0, lastSelectRowIndex: 0};
  var inputFlags = {isShiftDown: false, isCtrlDown: false, isAltDown: false};
 
  function keyPress(event) {//响应键盘按下事件
    var e = event || window.event;
    var code = e.keyCode | e.which | e.charCode;
    switch (code) {
        /*case KEY.SHIFT:
          inputFlags.isShiftDown = true;
          $('#baseOrderList').datagrid('options').singleSelect = false;
          break;*/
      case KEY.CTRL:
        inputFlags.isCtrlDown = true;
        $('#baseOrderList').datagrid('options').singleSelect = false;
        break;
      case KEY.ALT:
        inputFlags.isAltDown = true;
        $('#baseOrderList').datagrid('options').singleSelect = false;
        break;
      default:
    }
  }
 
  function keyRelease(event) { //响应键盘按键放开的事件
    var e = event || window.event;
    var code = e.keyCode | e.which | e.charCode;
    switch (code) {
        /*case KEY.SHIFT:
          inputFlags.isShiftDown = false;
          selectIndexs.firstSelectRowIndex = 0;
          $('#baseOrderList').datagrid('options').singleSelect = true;
          break;*/
      case KEY.CTRL:
        inputFlags.isCtrlDown = false;
        selectIndexs.firstSelectRowIndex = 0;
        $('#baseOrderList').datagrid('options').singleSelect = true;
        break;
      case KEY.ALT:
        inputFlags.isAltDown = false;
        selectIndexs.firstSelectRowIndex = 0;
        $('#baseOrderList').datagrid('options').singleSelect = true;
        break;
      default:
    }
  }

您可能感兴趣的文章:

相关文章