如何验证在引导箱消息中创建的表单？答案

【问题标题】：How to validate form created in bootbox message?如何验证在引导箱消息中创建的表单？
【发布时间】：2017-03-22 02:59:34
【问题描述】：

我正在使用bootbox.js。它允许用户在它的“消息”部分创建一个表单。但是，我想在点击提交按钮之前使用 jquery 进行一些验证。

这是引导箱：

bootbox.confirm({
   title    : "Choose Item:",
   message  : 
            "<?php 
                echo "<form id='f_item'>";
                echo "<h3>Item: </h3><br/>";
                foreach($item as $row_item){
                    echo "<input type='checkbox' name='item' class='cek_item' value='".$row_pic->item."' />";
                }
                echo "</form>";
            ?>",
 buttons    : {
                cancel  : { label: '<i class="fa fa-times"></i> Batal' },
                confirm : { label: '<i class="fa fa-check"></i> OK'}
            },
 callback: function (result) {
                //If OK button is pressed
                if(result == true){
                   /*SENT FORM CODE*/
                }
            }
        });

不添加一些验证表单提交工作。但是，我不知道将验证脚本放在哪里。

这是一个测试脚本
$(".cek_item").on('change',function(event){ alert($(this).val()+" is choosen"); });
我应该把这个脚本放在哪里？

我想做的验证是：

如果首先检查第一个项目，则不能检查其余项目检查。
如果不是首先检查第一项，则用户无法检查第一项。

【问题讨论】：

标签： javascript jquery forms validation bootbox

【解决方案1】：

您有点滥用 bootbox.confirm 功能，因为它并不是真的要包含表单内容。话虽如此，您可以在 /*SENT FORM CODE*/ 的位置添加验证 - 如果您从该回调返回 false，则模式不会关闭，因此类似于：

callback: function (result) {
    //If OK button is pressed
    if(result == true){
        /*SENT FORM CODE*/

        $("#f_item").validate();

        if($("#f_item").valid()) {
            /* form is valid */
        }
        else {
            /* form is not valid */
            return false;
        }
    }
}

这假设您也在使用jQuery Validation。

【讨论】：