dojo - 显示无效消息的编程方式

Posted 2023-02-16

【中文标题】dojo - 显示无效消息的编程方式

【英文标题】：dojo - programmatic way to show invalid message

【发布时间】：2011-09-12 05:22:29

【问题描述】：

dojo 新手 - 试一试。 提交表单后，如果服务器返回错误，我想在 dijit.form.ValidationTextBox 上显示该消息

var user_email = dijit.byId("login_user_email");
user_email.set("invalidMessage", data["result"]["user_email"]);
//need to force show the tooltip but how???

非常感谢任何帮助。

【参考方案1】：

在jsFiddle查看它的实际应用。

只显示工具提示：

var textBox = bijit.byId("validationTextBox");
dijit.showTooltip(
    textBox.get("invalidMessage"), 
    textBox.domNode, 
    textBox.get("tooltipPosition"),
    !textBox.isLeftToRight()
);

暂时切换textBox验证器，强制验证，恢复原验证器：

var originalValidator = textBox.validator;
textBox.validator = function() return false;
textBox.validate();  
textBox.validator = originalValidator;

或者同时做这两个。

【讨论】：

我喜欢 :) 似乎还有更多内容，我想他们会假设您只是制作自己的小部件...？

#2 为我工作，谢谢。我必须做的唯一修改是将焦点放在我的文本框上作为第一行：textBox.focus();

【参考方案2】：

我认为您可以通过 myVTB.displayMessage('这来自后端验证') 显示工具提示；方法

【参考方案3】：

您需要在验证器方法中进行验证。喜欢这里http://docs.dojocampus.org/dijit/form/ValidationTextBox-tricks 您还需要聚焦小部件以显示消息！ dijit.byId("whatever").focus()

【讨论】：

谢谢：遗憾的是，如果不通过验证器方法，我无法显示工具提示。我只是想通过 ValidationTextBox 的工具提示显示服务器交互的结果

【参考方案4】：

@arber 解决方案是使用新 dojo 时的最佳选择。只需记住在调用“displayMessage”方法之前将焦点设置到 TextBox。 我正在使用 dojo 1.10，它的工作原理如下：

function showCustomMessage(textBox, message)
    textBox.focus();
    textBox.set("state", "Error");
    textBox.displayMessage(message);

ValidationTextBox 的 Dojo 参考指南：https://dojotoolkit.org/reference-guide/1.10/dijit/form/ValidationTextBox.html

【参考方案5】：

我知道这个问题很古老，但希望这会对某人有所帮助。是的，您应该使用验证器，但如果您有理由不这样做，这将显示消息并使该字段无效：

        function(textbox, state /*"Error", "Incomplete", ""*/, message) 
            textbox.focus();
            textbox.set("state", state);
            textbox.set("message", message);
        

【参考方案6】：

你可以直接调用“私有”函数：

textBox._set('state', 'Error');

您会得到与@phusick 建议的结果相同的结果，但代码更少，而且可以说是以更直接、更简洁的方式。

注意事项： _set 可用于 ValidationTextBox，正如在其基类 dijit/_WidgetBase 上声明的那样。

现场演示： http://jsfiddle.net/gibbok/kas7aopq/

dojo.require("dijit.form.Button");
dojo.require("dijit.form.ValidationTextBox");
dojo.require("dijit.Tooltip");

dojo.ready(function() 

  var textBox = dijit.byId("validationTextBox");

  dojo.connect(dijit.byId("tooltipBtn"), "onClick", function() 

    dijit.showTooltip(
      textBox.get('invalidMessage'),
      textBox.domNode,
      textBox.get('tooltipPosition'), !textBox.isLeftToRight()
    );
  );

  dojo.connect(dijit.byId("validatorBtn"), "onClick", function() 
    // call the internal function which set the widget as in error state
    textBox._set('state', 'Error');
    /*
        code not necessary
        var originalValidator = textBox.validator;
        textBox.validator = function() return false;
        textBox.validate();  
        textBox.validator = originalValidator;
    */
  );

);