Question

我有一个基于Dijit的大型表单，在可折叠的TitlePanes中有许多Dijit。

当表单验证时，隐藏在已关闭的TitlePanes（显然）中的任何无效项目都无法看到。因此，似乎表单已经死了并且不会提交，但是，用户不知道，实际上隐藏在封闭的TitlePane中的错误阻止了表单处理。

这里的解决方案是什么？有一种简单的方法可以简单地打开包含处于错误状态的Dijits的所有TitlePanes吗？

Answer 1

如果通过以下方式进行验证，它将起作用： -

function validateForm() {
  var myform = dijit.byId("myform");
  myform.connectChildren();
  var isValid = myform.validate();
  var errorFields = dojo.query(".dijitError");
  errorFields.forEach(fieldnode){
    var titlePane = getParentTitlePane(fieldnode);
    //write a method getParentTitlePane to find the pane to which this field belongs
    if(titlePane) {
      titlePane.set('open',true);
    }
  }
  return isValid;
}

function getParentTitlePane(fieldnode) {
  var titlePane;
  //dijitTitlePane is the class of TitlePane widget
  while(fieldnode && fieldnode.className!="dijitTitlePane") {
    fieldnode= fieldnode.parentNode;
  }
  if(fieldnode) {
     mynode = dijit.getEnclosingWidget(fieldnode);
  }
  return titlePane;
}

假设以下是HTML，我们在提交表单时调用上面的validateForm。

<form id="myform" data-dojo-type="dijit/form/Form" onSubmit="validateForm();">
 ......
</form>

Answer 2

这就是我最终做的事情（我对Javascript并不是很好，所以这可能很糟糕，但它有效 - 建议改进建议）：

    function openTitlePanes(form) {

        // Iterate through the child widgets of the form
        dijit.registry.findWidgets(document.getElementById(form.id)).forEach(function(item) {

            // Is this a title pane?
            if (item.baseClass == 'dijitTitlePane') {

                // Iterate the children of this title pane
                dijit.registry.findWidgets(document.getElementById(item.id)).forEach(function(child) {

                    // Does this child have a validator, and -- if so -- is it valid?
                    if (!(typeof child.isValid === 'undefined') && !child.isValid()) {

                        // It's not valid, make sure the title pane is open
                        item.set('open', true);
                    }
                });
            }
        });
    }

如何在封闭的TitlePanes中显示无效的表单Dijit？

2 个答案: