【问题标题】:How to create html form to perform php query and retrieve results如何创建 html 表单来执行 php 查询和检索结果
【发布时间】:2021-02-19 11:07:28
【问题描述】:

我需要创建一个包含 5 个字段的表单,每个字段都将输入一个数字,单击一个按钮会根据字段中输入的值执行查询,并在 html 页面中显示结果。

谢谢。

【问题讨论】:

  • each field is a column in a mysql database 这种说法是糟糕设计问题的代名词
  • 无论何时您处于编程的早期阶段,我强烈建议您不要使用try/catch,而是将make sure error reporting 设置为提醒您所有事情,否则很小错误可能需要一段时间才能诊断。异常是供开发人员查看和处理的。这有一种尝试太多的代码气味。我看到了 AJAX、jQuery 和一个用于创建 HTML 的类。我建议大大简化它,让它工作,然后再添加更复杂的功能。
  • 所以你想要一件事,但你发布了做其他事情的代码。需要更多关注。

标签: php html mysql forms


【解决方案1】:

我通过以下方式实现了我想要的:

<?php


echo "<table style='border: solid 1px black;'>";
echo "<tr>
<th>F1</th>
<th>F2</th>
<th>F3</th>
<th>F4</th>
<th>F5</th>
</tr>";


class TableRows1 extends RecursiveIteratorIterator {
function __construct($it1) {
    parent::__construct($it1, self::LEAVES_ONLY);
}

function current() {
    return "<td style='width: 70px;'>" . parent::current(). "</td>";
}

function beginChildren() {
    echo "<tr>";
}

function endChildren() {
    echo "</tr>" . "\n";
}
}

if( isset($_POST['submit']) )
{
    $feature = $_POST['F1'];
    $feature2 = $_POST['F2'];
    $feature3 = $_POST['F3'];
    $feature4 = $_POST['F4'];
    $feature5 = $_POST['F5'];
};



$feature = $_POST['F1'];
$feature2 = $_POST['F2'];
$feature3 = $_POST['F3'];
$feature4 = $_POST['F4'];
$feature5 = $_POST['F5'];

$values = [$feature, $feature2, $feature3, $feature4, $feature5];


$servername = "";
$username = "";
$password = "";
$dbname = "";

try {


$conn1 = new PDO("mysql:host=$servername;dbname=$dbname", $username, 
$password);
$conn1->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt1 = $conn1->prepare(

"SELECT
F1, 
F2, 
F3, 
F4, 
F5
FROM table
WHERE
F1 = ?
AND
F2 = ?
AND
F3 = ?
AND
F4 = ?
AND
F5 = ?");

$stmt1->bindParam(1, $feature, PDO::PARAM_INT);
$stmt1->bindParam(2, $feature2, PDO::PARAM_INT);
$stmt1->bindParam(3, $feature3, PDO::PARAM_INT);
$stmt1->bindParam(4, $feature4, PDO::PARAM_INT);
$stmt1->bindParam(5, $feature5, PDO::PARAM_INT);

$stmt1->execute();


// set the resulting array to associative
$result1 = $stmt1->setFetchMode(PDO::FETCH_ASSOC);

foreach(new TableRows1(new RecursiveArrayIterator($stmt1->fetchAll())) as 
$k1=>$v1) {
    echo $v1;
}
}
catch(PDOException $e1) {
echo "Error: " . $e1->getMessage();
}
$conn1 = null;
echo "</table>";

if (condition) {
      
      echo '';
    } 

elseif (condition ) {
    
    echo '';
       
}

?>

表单和javascript:

<form align = "center" action="" method="POST" id = "form">
    <input name="F1"  type = "number" min="1" max="34" step="1"/> 
    <input name="F2"  type = "number" min="2" max="35" step="1"/>
    <input name="F3"  type = "number" min="3" max="36" step="1"/> 
    <input name="F4"  type = "number" min="4" max="37" step="1"/>
    <input name="F5"  type = "number" min="5" max="38" step="1"/>
    <br>
    <br>
  </form>

  <script type="text/javascript">
  $(document).ready(function() {
  $(".mybutton").click(function() {

    $.ajax({
        type: "post",
        url: "checadorRetro.php",
        data: $("form").serialize(),
        success: function(result) {

            $(".myresult").html(result);
        }
    });

    });
    });
   </script>

结果和按钮:

 <div class="myresult"></div>
 <div class = "buscar">
 <button id="display" class="mybutton">Revisar</button>
 </div>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-08-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-01
    • 2014-11-11
    • 2018-12-16
    • 1970-01-01
    相关资源
    最近更新 更多