我无法在提交表单之前检查复选框组

时间:2019-02-28 20:09:29

标签: javascript php jquery html

我需要在提交之前验证表单上的多个checkboxGroups,但我不能这样做。

这是我的代码:

<div class="form-wrapper">
                <form class="form1" action="update-2.php" id="profile" onClick="validate()" method="post">
                    <fieldset class="preguntas">

\-在这里,我创建了7个具有不同ID的复选框组,我将其中一个作为示例发布-\

<p>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Rimel" id="maquillaje">
                                Rimel</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Sombra" id="maquillaje">
                                Sombra</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Delineador" id="maquillaje">
                                Delineador</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Cuidado para sombracelhas" id="maquillaje">
                                Cuidado para sombracelhas</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Batom" id="maquillaje">
                                Batom</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Batom liquido" id="maquillaje">
                                Batom liquido</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Gloss" id="maquillaje">
                                Gloss</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Batom que aumenta labios" id="maquillaje">
                                Batom que aumenta làbios</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Delineador de labios" id="maquillaje">
                                Delineador de làbios</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Primer" id="maquillaje">
                                Primer</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Corretivo" id="maquillaje">
                                Corretivo</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Base hidratante" id="maquillaje">
                                Base hidratante</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Po corretivo" id="maquillaje">
                                Pó corretivo</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Blush" id="maquillaje">
                                Blush</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Iluminador" id="maquillaje">
                                Iluminador</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Bronzer e contorno" id="maquillaje">
                                Bronzer e contorno</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Pincéis e outros aplicadores de maquiagem" id="maquillaje">
                                Pincéis e outros aplicadores de maquiagem</label>
                              <br>

                          </p>

 <p>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Rimel" id="maquillaje">
                                Rimel</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Sombra" id="maquillaje">
                                Sombra</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Delineador" id="maquillaje">
                                Delineador</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Cuidado para sombracelhas" id="maquillaje">
                                Cuidado para sombracelhas</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Batom" id="maquillaje">
                                Batom</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Batom liquido" id="maquillaje">
                                Batom liquido</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Gloss" id="maquillaje">
                                Gloss</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Batom que aumenta labios" id="maquillaje">
                                Batom que aumenta làbios</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Delineador de labios" id="maquillaje">
                                Delineador de làbios</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Primer" id="maquillaje">
                                Primer</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Corretivo" id="maquillaje">
                                Corretivo</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Base hidratante" id="maquillaje">
                                Base hidratante</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Po corretivo" id="maquillaje">
                                Pó corretivo</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Blush" id="maquillaje">
                                Blush</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Iluminador" id="maquillaje">
                                Iluminador</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Bronzer e contorno" id="maquillaje">
                                Bronzer e contorno</label>
                              <br>
                              <label>
                                <input type="checkbox" name="maquillaje[]" class="option" value="Pincéis e outros aplicadores de maquiagem" id="maquillaje">
                                Pincéis e outros aplicadores de maquiagem</label>
                              <br>

                          </p>

我试图通过一个说明

的php错误处理程序对其进行验证
if(empty($_POST['maquillaje'])){
header("location: wahtever.php?check");
}else{ .... all the code to write on the database...}

但是它将刷新页面的内容,

我还尝试使用javascript对其进行验证

<script>
    document.getElementById("profile").onsubmit = function () {
    var send = document.getElementById("maquillaje"),
        sendValue = send.value,
        sendCheck = send.checked,
        errors = "";
    if (!sendCheck) {
        errors += "Please answer question 5";
    }
if (errors != "") {
        alert(errors);
        return false;
}
        alert("Your details are being sent"); 
    return true; 
}

</script>

但是我有相同的结果,它不会验证该复选框,而是即使该复选框被选中也将刷新页面...

还尝试了一个Jquery,但是我会一直得到警报文本框,并且永远不会提交表单

我是这里的菜鸟,可能是我犯了一个愚蠢的错误 请帮助!!!!

1 个答案:

答案 0 :(得分:0)

jQuery方法可能是您最简单的解决方案。

您需要添加的主要内容是“ preventDefault”功能。这将阻止表单提交到后端。然后,您可以检查空白字段。如果没有错误,请通过添加indexColumn

提交表单
-15px

在文档中:https://api.jquery.com/event.preventdefault/