Peter Blum验证器未在JQuery Steps向导内部启动

Peter Blum validators not firing inside of JQuery Steps wizard

本文关键字：Steps 向导 内部 启动 JQuery Blum 验证 Peter      更新时间：2023-09-26

我使用JQuery Steps在WebForms项目中设置向导，并使用Peter Blum的VAM验证器来确保输入良好。以下是我流程中第一步的示例：

 <div id="wizard">
           <h1>Step 1</h1>
            <div id="stepToAccount">
                <p class="sectionHeader">
                    <asp:Label id="DropdownLabel" runat="server"/>
                </p>
                <asp:DropDownList id="Dropdown" CssClass="indent50" runat="server"/>
                <br/>
                <vam:RequiredListValidator runat="server" ID="DropdownIsRequired" Group="StepOne" ControlIDToEvaluate="Dropdown" UnassignedIndex="0" ErrorMessageLookupID="DropdownRequired.Error" SummaryErrorMessageLookupID="DropdownRequired.Error"/>
            </div>

所有这些在我用来指定向导（<div id="wizard">）的div之外都能100%正常工作，但在向导div内部无法正常工作。单击下拉列表不会导致它立即按预期进行验证，如果我用window.DES_ValidateGroup("StepOne")手动调用验证，它将正确返回步骤有问题（步骤平铺变为红色），但它不会显示验证器附带的错误消息。

深入了解原因，VAM验证器发出的<span>标签似乎有一个内联visibility标签，可以防止它们被隐藏，然后VAM的javascript会删除该标签，并在需要时重新应用（例如，当验证器失败时，然后再次成功时）。向导分区内的验证失败时，visibility标记未正确删除。

有人知道为什么会发生这种情况，以及我如何解决它吗？

编辑：供参考，这是发出的代码：

 <div id="wizard">
            <h1>Step 1</h1>
            <div id="StepOne">
                <p class="sectionHeader">
                    <span id="DropdownLabel">Which account would you like to pay to?</span>
                </p>
                <select name="Dropdown" id="SelectToAccountDropdown" class="indent50">
<option selected="selected" value="0">-- Option One -- </option>
<option value="1">Option Two</option> 
</select>
       <span class="indent50">
                    <span style='visibility:hidden' class='VAMErrorText'  id='DropdownIsRequired'>
   <span id='DropdownIsRequired_Txt'>Please select a thing.</span>
</span>    
                </span>                    
            </div>

问题是JQuery Steps在其呈现方法期间将事件侦听器从DOM中剥离，从而禁用了Peter Blum验证器所依赖的侦听器。请看Kaish对这个问题的回答；用他在那里使用的方法替换JQuery Steps render()方法解决了我的问题。

相关文章：