Question

我有一个页面，用户在其中打印数据，然后单击提交按钮。

<form id="myForm" action="/validate-configuration" _method="post" method="post" enctype="multipart/form-data"
          onsubmit="return validateForm(this);">
    <table>
     ...
         <tr>
             <td></td>
                 <input 
                     type="submit" 
                     value="Obfuscate"
                     onclick="return doConfirm('<%=messageSource.getMessage("message.DatabasePage", null, LocaleContextHolder.getLocale())%>',
                       function yes() {
                             $('#myForm').submit();
                       },
                       function no() {});"
                  />
             </td>
             <td>&nbsp;</td>
          </tr>
    </table>
</form>

<div id="confirmBox" class="modal">
    <div class="modal-content">
        <div class="message"></div>
        <button type="button" class="yes">Yes</button>
        <button type="button" class="no">No</button>
    </div>
</div>

当用户单击“提交”时，首先出现确认窗口。但是我想丰富下一个行为。当未输入某些内容时，首先需要进行作品验证功能，并且在完成所有输入字段后，单击“提交”按钮后将显示确认按钮。

function validateForm(form) {
        return validateConfigurationSelect(form) && validateDBCredentials(form) && validateSalt(form);
    }

    function doConfirm(msg, yesFn, noFn) {
    var confirmBox = $("#confirmBox");
    confirmBox.find(".message").text(msg);
    confirmBox.find(".yes,.no").unbind().click(function () {
        confirmBox.hide();
    });
    confirmBox.find(".yes").click(yesFn);
    confirmBox.find(".no").click(noFn);
    confirmBox.show();
}

答案：使函数doConfirm像这样：

    function doConfirm(msg, yesFn, noFn, validationFunc) {
    if (validationFunc) {
        var confirmBox = $("#confirmBox");
        confirmBox.find(".message").text(msg);
        confirmBox.find(".yes,.no").unbind().click(function () {
            confirmBox.hide();
        });
        confirmBox.find(".yes").click(yesFn);
        confirmBox.find(".no").click(noFn);
        confirmBox.show();
    }
}

并在hmtl标记中将按钮形式从“提交”替换为“按钮”并添加功能：

input type="button" value="Obfuscate" onclick="
                doConfirm('<%=messageSource.getMessage("message.dialog.DatabasePage", null, LocaleContextHolder.getLocale())%>',
                function yes() {
                $('#myForm').submit();
                },
                function no() {
                },
                validateForm()
                );"/>

还要注意validatevalid（）应该返回布尔值。

Answer 1

首先，您不应该在客户端（使用Javascript）上进行验证，而应该在服务器上（对于Java）进行验证。用javascript进行验证是不好的，因为它很容易通过它。

但是，请回答您的问题。将您的代码更改为：

<input type="button" 
                     value="Obfuscate"
                     onclick="if (validateForm()) { return doConfirm('<%=messageSource.getMessage("message.DatabasePage", null, LocaleContextHolder.getLocale())%>',
                       function yes() {
                             $('#myForm').submit();
                       },
                       function no() {}); } else { showErrors() } "
                  />

您不需要在validateForm（）中传递“ form”参数，因为您可以使用document.getElementBy("")等来检索值。

所以总结一下：

用户按下“保存”按钮（不是提交类型而是按钮类型按钮）
validateForm()被称为
如果为true，则调用doConfirm（），如果为“确定”按钮，则调用$('#myForm').submit();
如果为false，则显示一些错误

确认窗口前如何调用验证功能？

1 个答案: