检查是否输入了必填字段答案

【问题标题】：Checking if required fields have been entered检查是否输入了必填字段
【发布时间】：2013-02-13 12:45:28
【问题描述】：

我在 php 文件中有一个表单。

该表单中有一个表格，其中包含必需的 SELECT 元素和必需的 INPUT TEXT 元素。

在表格下方还有一个提交按钮。

提交可以完美地检查表单中的必填字段是否具有值，并提醒用户哪些元素需要值。

问题：

我希望另一个按钮基本上可以检查提交按钮所做的检查，即提醒我哪些必填字段需要值但不提交表单。

基本上：

单击提交按钮时会调用哪些函数，以便我可以使用检查表单是否完成的方法。

ContactCard.php

<?php
    require_once("config.php");

    //Connect to our database
    $mysqli = new mysqli(DB_HOST, DB_USER, DB_PASS, DB_NAME);

    //Return an error if we have connection issues
    if ($mysqli->connect_error)
    {
        die('Connect Error (' . $mysqli->connect_errno . ') '. $mysqli->connect_error);
    }

    //Query the database for the results we want
    $query = $mysqli->query("SELECT field FROM `contact_fields`");

    //Create an array of objects for each returned row
    while($array[] = $query->fetch_object());

    //Remove the blank entry at end of array
    array_pop($array);

    //Print our array results
    //print_r_html($array);
?>

<?php
    //Free result set and close connection 
    $query->close();
    $mysqli->close();
?>

<html>
<head>
<title>Add a Contact</title>
<link <link rel="stylesheet" type="text/css" href="ContactCard.css">
<script>
function addOptRow()
{

    var optTable        = document.getElementById("optTable");
    var optTableRows    = optTable.rows.length;
    var newOptRow       = optTable.insertRow(optTableRows);


    //create the dropbox fields for the new row
    var optFieldNames   = document.createElement("select");
    optFieldNames.name  = "optFieldNames";
    optFieldNames.options[optFieldNames.options.length] = new Option("",null);
    "<?php foreach($array as $option) : ?>"
        optFieldNames.options[optFieldNames.options.length] = new Option("<?php echo $option->field; ?>",null); 
    "<?php endforeach; ?>"  
    var optFieldNamesCell   = newOptRow.insertCell(0);
    optFieldNamesCell.appendChild(optFieldNames);

    //create the field value for the new row
    var optFieldValue   = document.createElement("input");
    optFieldValue.type  = "text";
    optFieldValue.name  = "optFieldValue";
    optFieldValue.required  = "true";
    var optFieldValueCell   = newOptRow.insertCell(1);
    optFieldValueCell.appendChild(optFieldValue);

    //create the field remove for the new row
    var optFieldRemove  = document.createElement("input");
    optFieldRemove.type = "button";
    optFieldRemove.value    = "Remove";
    optFieldRemove.onclick  = function(){removeOptRow(this);}
    var optFieldRemoveCell  = newOptRow.insertCell(2);
    optFieldRemoveCell.appendChild(optFieldRemove);
}

function removeOptRow(removeButton)
{
    var optTable = document.getElementById("optTable");
    optTable.deleteRow(removeButton.parentNode.parentNode.rowIndex);
}

function checkAllFieldsComplete()
{
    //if(!isset( stuck here :(
}
</script>

</head>

<body>
    <h1 id="title" >Add A Contact</h1>

    <form>  
    <fieldset id="reqFields">
    <legend>Required Fields</legend>
    <table id="reqTable">
    <tr>
        <td>Company Name</td><td><input type="text" required></input></td>
    </tr>
    <tr>
        <td>Company Code</td><td><input type="text" required></input></td>
    </tr>
    </table>
    </fieldset>


    <fieldset id="optFields">
    <legend>Optional Fields</legend>
    <table id="optTable">
    <tr><th></th><th></th><th><input type="button" value="Add" onclick=addOptRow()></button></th></tr>  
    </table>
    </fieldset> 
    <input type="submit"></input>   
    </form> 


    <div id="test" name="test">
    </div>
</body>

</html>

【问题讨论】：

发布您的代码.. 您的验证目前是如何工作的。是服务器端还是js中的？
如果你真的想看我不介意的文件，我已经将它附加到我的 OP 中。
表单甚至没有动作，这对 NOW 来说很好。它为我没有为其输入值的每个字段提供一个弹出窗口。太棒了！基本上我只想检查是否有任何必需的元素具有值。动态是可能的。提交按钮可以做到这一点，为什么我不能:(不提交。
stackoverflow.com/questions/11866910/…
谢谢，但不是这样。我不想创建自己的方法，而是调用提交调用的方法。

标签： php forms select submit

【解决方案1】：

您可以通过多种方式首先使用required 进行表单验证

<input type="text" required>

如果没有填写，您可以使用 java 脚本进行客户端验证以进行即时响应，您也会找到很多解决方案

javascript validation for empty input field

否则你必须在服务器端进行

【讨论】：

我有那个 rohitarora，谢谢，但是我想在不点击提交按钮的情况下检查 REQUIRED 字段中的哪些字段有值，这可能吗？

【解决方案2】：

要回答您关于“html”的问题，您可以在单击按钮时调用 javascript：

<input type="submmit" onclick="java_validation_function();" />

基本上你有两种可能性：

将所有内容发布到您的 PHP 并检查 POST 变量是否存在，如果不存在则返回错误页面
在提交到服务器之前使用 javascript 检查。您可以为此使用 jquery 验证，并从 INPUT 调用 onclick 参数上的 jquery 验证。

这里有一个 jquery/validation 示例：http://docs.jquery.com/Plugins/Validation

【讨论】：

和 jquery 一样神奇，我不想添加库来做已经存在的事情

【解决方案3】：

您可以使用脚本执行此操作。

它检查 validate 是否返回 true 或 false。

$('#send').click(function(e) {
    e.preventDefault();
    if (validate()) {
        $('#myForm').submit();
    }
});

此函数返回真或假。如果 id="field" 的输入为空，则返回 false。

function validate() {
    ok = true;

    if ($('#field').val() == "") {
        $('#field').attr({
            placeholder: 'Required'
        });
        ok = false;
    }
    return ok;
}

【讨论】：

我想这正是我想要的，让我试试看。
感谢用户的建议，实际上我误读了您的建议。您会看到，一旦我单击提交按钮，显然有一个内置函数 \ 方法会进行表单验证，只是想弄清楚。
如果您想要其他按钮来检查表单是否已填写。只需使用我给您的相同代码，但使用 $("#checkButton").click 而不是提交按钮。还是我误解了你的问题？