Question

我在手风琴的3个不同的手风琴窗格中使用ValidatorCalloutExtender用于不同的asp控件。当我收到错误并单击另一个手风琴窗格标题时，错误消息显示在浏览器的左上角。如何隐藏或淡出此错误消息？

Answer 1

我认为你现在已经想到了这个问题（4个月？）。但我认为这是一个有趣的挑战，我之前已经处理过验证器。

解决方案是挂钩到accordion控件的SelectedIndexChanged事件，并禁用所有隐藏窗格的验证器。

首先，我们必须为手风琴控件添加一个钩子。这使用jQuery（我不知道有任何其他方法来实现这一点）。该变量包含手风琴功能的客户端ID。

    var accordianId = 'MyAccordion';
    function pageLoad()  
    {  
        var accCtrl = $find(accordianId + '_AccordionExtender');
        accCtrl.add_selectedIndexChanged(onAccordionPaneChanged);    
    }

这当然是所有客户端（javascript）。

之后，我们需要创建onAccordionPaneChanged方法来遍历手风琴窗格中的所有DIV，并禁用与隐藏DIV关联的所有验证器（并为新打开的DIV启用所有验证器）：

    function onAccordionPaneChanged(sender, eventArgs)  
    {  
       var indexSelectedPane = sender.get_SelectedIndex();
       //   There are two divs per "pane":  1 Header, 1 Content
       //   That would make the DIV odd, but there's an additional
       //   hidden element at the front, so it's the Even item.
       var indexContentDiv = (indexSelectedPane * 2) + 2;
       var accordianControl = document.getElementById(accordianId);
       var i, boolEnable;

       for(i = 0; i < accordianControl.children.length; i++)
       {
            //Odd number, this must be a Content section
            boolEnable = false;
            if (i == indexContentDiv)
            {
                boolEnable = true;
            }
            EnableDisableValidators(accordianControl.children[i], boolEnable);
       }
   }

请注意，在上面，它提到了每个窗格的两个DIV。会发生的事情是，每个窗格都会创建两个DIV：一个用于标题，另一个用于页脚。如果遍历所有子节点，则每个其他DIV都是包含内容的DIV。因此，要仅禁用内容部分中的所有验证器，我检查（i％2 == 1），这表示这是一个“奇数”div，它们是内容div。

最后，EnableDisableValidators函数接受给定的DIV并检查所有Page的验证器，以查看它们是否是此DIV中的控件。如果它们在此DIV中，它将根据传入的值（由此DIV是否是所选的DIV确定）启用或禁用验证器。

不幸的是，由Accordion控件生成的DIV没有ID，所以你必须专门搜索div中的所有控件

   function EnableDisableValidators(divParent, setEnabled)
   {
        var childValidator;
        var j;
        var k;

        if (divParent.children == null || divParent.children.length == 0)
        {
            return;
        }
        //  Check all the validators to see if they're one of the children
        for (j = 0; j < Page_Validators.length; j++)
        {
            // Check all the children of the DIV for the given validator
            for (k = 0; k < divParent.children.length; k++)
            {
                if (FindControlRecursive(divParent, Page_Validators[j].id) != null)
                {
                    ValidatorEnable(Page_Validators[j], setEnabled);
                }
            }
        }
   }

另一个缺点是我们必须找到DIV中的所有孩子，为此我们必须使用递归。所以，这是一个“简单”的功能（如上所述）：

   function FindControlRecursive(parentNode, childID)
   {
        var l;
        var retChild;

        for (l = 0; l < parentNode.children.length; l++)
        {
            if(parentNode.children[l].id != null && 
                parentNode.children[l].id == childID)
            {
                return parentNode.children[l];
            }
            else
            {
                retChild = FindControlRecursive(parentNode.children[l], childID);
                if (retChild != null)
                {
                    return retChild;
                }
            }
        }
        return null;
   }

这种方法存在一些问题。首先，当您提交表单时，只有当前窗格中可见的验证器才会发布错误。所有隐藏的验证器都不会显示。要解决此问题，您可以添加提交按钮的“onclick”功能，该功能将遍历所有Page_Validators并在您提交之前启用它们。您可能（在那时）也必须检查验证器。但这是一个完全不同的问题。 ;）

另一个问题是当你点击它们附加的控件时，扩展器似乎会显示出来。当启用验证器功能以显示需要哪些字段时，您可以使用相同的功能调用验证器功能。（只是一个可能的解决方案。）但同样，这是一个完全独立的问题！

希望这有帮助。

如何用手风琴隐藏或淡化ValidatorCalloutExtender

1 个答案: