找回密码
 立即注册

QQ登录

只需一步,快速开始

Derrick.Jiao 讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2021-6-7 11:26  /   查看:1923  /  回复:0
使用过数据验证的小伙伴都知道,我们有inputMessage用于在输入数据前,点击单元格的输入提示。其实我们可以换个思路,将其改为输入出错后才显示,不出错时,则不显示,就像普通单元格一样。这个需要与ErrorMessage区分开来。本帖的目的就是实现出错提示能够悬浮展示,就像下图这样。
image.png111271971.png

首先我们需要添加一个数据验证,并且将showInputMessage设为false,这样默认就不会显示InputMessage
  1. spread.options.highlightInvalidData = true;
  2. var dv = GC.Spread.Sheets.DataValidation.createNumberValidator(GC.Spread.Sheets.ConditionalFormatting.ComparisonOperators.between, "5", "20", true);
  3. dv.showInputMessage(false);
  4. dv.inputMessage("Value must be between 5 and 20.");
  5. dv.inputTitle("tip");
  6. sheet.setDataValidator(1, 1, 1,1,dv,GC.Spread.Sheets.SheetArea.viewport);
复制代码


接下来我们需要监听ValidationError事件,当该事件触发时,表示单元格数据验证没通过,此时我们把showInputMessage设为true,这样就能显示InputMessage的内容。
  1. sheet.bind(GC.Spread.Sheets.Events.ValidationError, function(e, args) {
  2.        args.validator._ps.showInputMessage = true;
  3.     });
复制代码


最后一步我们还需要监听ValueChanged事件,触发此事件后,我们在里面用isValid判断单元格的值是否合法,合法则将showInputMessage设为false,不再显示InputMessage的内容。
  1. sheet.bind(GC.Spread.Sheets.Events.ValueChanged, function (e, info) {
  2.        if(sheet.isValid(info.row, info.col,info.newValue)){
  3.         sheet.getCell(info.row, info.col).validator()._ps.showInputMessage = false;
  4.     }
  5. });
复制代码


0 个回复

您需要登录后才可以回帖 登录 | 立即注册
返回顶部