Question

我正在制作一个数据库程序，用户必须提交一些联系信息。

 <form action="add_action.php" method="POST">
                <div class="modal-body">
                    Name: <br>
                    <input type="text" name="name" placeholder="Name" required><br>
                    Telefon Nr. <br>
                    <input type="text" name="telNr" placeholder="Telefon Nr."><br>
                    Handy Nr. <br>
                    <input type="text" name="handyNr" placeholder="Handy Nr."><br>
                    Skype ID <br>
                    <input type="text" name="skypeId" placeholder="Skype ID"><br>
                <div class="modal-footer">
                    <input type="submit" class="btn btn-default" value="Hinzufügen">
                </div>
            </form>

我已经研究了一段时间，但是我似乎无法弄清楚如何设置表格，以便“ Telefon Nr。”，“ Handy Nr”中至少有1个。并且需要“ Skype ID”。如果您对我应该做的事情有任何建议，我将不胜感激。

Answer 1

考虑阅读此书。我将仅展示如何检查名为name的字段以及其他至少一个字段的存在性。

服务器端验证：

Ps：例如，您没有给提交button一个name，而是给它一个name="submit"，以便可以在php。

if{isset($_POST["submit"])
    // don't rely on HTML required attribute, a user with a bit of knowledge can remove/bypass it, I mean check for the presence of the name either
    $name = trim($_POST["name"]);
    $telNr = trim($_POST["telNr"]);
    $handyNr = trim($_POST["handyNr"]);
    $skypeId = trim($_POST["skypeId"]);
    if(isset($name[0]) && (isset($telNr[0]) || isset($handyNr[0]) || isset($skypeId[0]))) {
        echo "At least one field is present alongside with the name";
    } else {
        echo "The name and/or the other fields are empty";
    }
}

客户端验证：

PS：让我给ID标签加上form，比方说id="my-form"。

var myForm = document.getElementById("my-form");
myForm.addEventListener("submit", function(event){
    // get all the fields values, and trim them on the fly
     var name = document.getElementsByName("name")[0].value().trim(),
         telNr = document.getElementsByName("telNr")[0].value().trim(),
         handyNr = document.getElementsByName("handyNr")[0].value().trim(), 
         skypeId = document.getElementsByName("skypeId")[0].value().trim();
     // we want the name and at least one other field to be filled
     if(name !== "" && (telNr !== "" || handyNr !== "" || skypeId !== "" )) {
         alert("we're good to go, the name is provided alongside with at least another field");
     } else {
         event.preventDefault(); // we cancel form submission as the name and/or the other fields are empty using the Event argument
         alert("Cancelled, please fill in the name and at least one other field");
     }
});

希望我能进一步推动您进一步了解工作原理

Ps ：这是一个非常基本的示例，不要在生产阶段依赖它，因为我提供的代码可能容易受到某些攻击（例如XSS或跨站点脚本，SQL注射...）。

Answer 2

您需要使用一些JavaScript来做到这一点。使用HTML唯一可以做的就是像添加名称一样添加“ required”属性。

Answer 3

这是我前一段时间以某种形式创建它的方式。我已经为您进行了编辑，因此将其放进去，应该立即使用。

<script>
function validateForm() {
    var a,b,c,d = document.forms["form"]["name","telNr","handyNr","skypeId"].value;
    if (a,b,c,d==null || a,b,c,d=="")
  {
  alert("Please complete all Required Fields *");
  return false;
  }
    }
</script>

<body>

<form name="form" action="add_action.php" onsubmit="return validateForm()" method="POST">

                <div class="modal-body">

                    Name: <br>
                    <input type="text" name="name" placeholder="Name"><br>

                    Telefon Nr. <br>
                    <input type="text" name="telNr" placeholder="Telefon Nr."><br>

                    Handy Nr. <br>
                    <input type="text" name="handyNr" placeholder="Handy Nr."><br>

                    Skype ID <br>
                    <input type="text" name="skypeId" placeholder="Skype ID"><br>

                <div class="modal-footer">

                <button type="submit" class="btn btn-default" value="Hinzufügen" >Sign In</button>


                </div>
            </form>

至少需要3个表单输入字段中的1个

3 个答案: