0

我在 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>
4

3 回答 3

0

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

它检查 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;
}
于 2013-02-13T12:59:02.013 回答
0

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

<input type="text" required>

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

空输入字段的javascript验证

否则你必须在服务器端做

于 2013-02-13T12:48:43.977 回答
0

要回答您关于“html”的问题,您可以在单击按钮时以这种方式调用 javascript:

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

基本上你有两种可能性:

  1. 将所有内容发布到您的 PHP 并检查 POST 变量是否存在,如果不存在则返回错误页面

  2. 在提交到服务器之前使用 javascript 进行检查。您可以为此使用 jquery 验证,并从 INPUT 调用 onclick 参数上的 jquery 验证。

在这里您会找到一个 jquery/validation 示例:http ://docs.jquery.com/Plugins/Validation

于 2013-02-13T12:48:51.330 回答