1

我有几个文本框通过验证（服务器和客户端）的表单。在表单中，我有按钮：“下一步”、“返回”、“取消”。所以我不需要验证来启动然后用户点击“返回”或“取消”按钮。我怎样才能做到这一点？提前致谢！

一些样本：

<div class="buttons">    
<input type="submit" name="cancelButton" value="" />
<input type="submit" name="backButton" value="" />
<input type="submit" name="nextButton" value="" />
</div>

<% using (Html.BeginForm()) { %>
    <p>

    <table style="width: 200px">    
    <tr><td align="center" colspan=2><%= Html.ValidationMessageFor(m => m.street) %><%= Html.DropDownListFor(m => m.street, Model.streetsList) %></td></tr>
    <tr><td colspan=2>&nbsp;</td></tr>
    <tr><td valign="bottom" align="right" style="width: 75px"><%= Html.LabelFor(m => m.flatNumber) %>:</td><td align=left><%= Html.TextBoxFor(m => m.flatNumber, new { maxlength = 6, style = "width: 48px;" })%> <%= Html.ValidationMessageFor(m => m.flatNumber) %></td></tr>
    </table>
    <br />

        <input type="submit" class="refusal button red floatL" name="cancelButton" value="" />
        <input type="submit" class="back button green floatL" name="backButton" value="" />
        <input type="submit" class="continue button green floatR marR" name="nextButton" value="" />
    </div>
    <div class="clear">
    </div>
    <% } %>

在服务器端，我使用 DataAnnotations 属性进行验证。

4

2 回答 2

3

Button 类有一个 CausesValidation 属性 - 如果该属性设置为 false，则不会在回发时触发验证。

例子：

<asp:Button id="btnCancel" CausesValidation="false" onClick="bntCancel_Click" Text="Cancel" runat="server" />

请注意，这将禁用 ASP.NET 验证器 - 如果您有自己的验证，则需要以另一种方式禁用它。

于 2011-07-04T08:13:52.743 回答
2

用表单包围文本框，然后将下一步、返回和取消变成提交按钮。在 onsubmit 事件上，分配一个方法，如果表单有效则返回 true 并继续将其发送到服务器，否则返回 false。

因此，我期望以下内容：

<form id="navigatorForm">
    <!-- Various text forms here -->

    <input type="submit" value="Back" onsubmit="back()" />
    <input type="submit" value="Next" onsubmit="next()" />
    <input type="submit" value="Cancel" onsubmit="cancel()" />
    <input type="hidden" id="operation" name="operation" value="" />
</form>

<script type="text/javascript">
function validate() {
    // Perform validation here
    // If okay, return true, else false
}

function next() {
    document.getElementById('operation').value = 'next';
    if(!validate()) {
        alert('Form is not filed correctly.  Please pay more attention!');
        return false;  // Do not send to server!  
    } else {
        return true;
    }
}

function back() {
    document.getElementById('operation').value = 'back';
    return true;
}

function cancel() {
    document.getElementById('operation').value = 'cancel';
    return true;
}
</script>

请注意，与 next() 不同，back() 和 cancel() 无条件返回 true，这意味着在任何情况下都将请求发送到服务器。此时，在服务器端，您只需要检查下一步是否操作即可知道您是否应该执行进一步的测试。

于 2011-07-04T08:16:47.317 回答