我想提交表格，并说成功提交并停留在同一页面上

时间：2018-06-26 14:42:57

标签： php html mysqli

这是我的lockcheckoutbeta.php文件，用于输入信息

<!DOCTYPE html>
<html>
<head>
<link href="lockproject.css" type="text/css" rel="stylesheet">
 <title>Locks Out Form</title>
 <h1>Facilities Departmental Lock Checkout Entry Form </h1>
 </head>
 <body>
 <h3> *All fields must be populated </h3>
 <form action="insert.php" method="post">
 <table style="width:100%">
 <thead>
<tr>
 <th>Lock Number</th>
 <th>Equipment # or description:</th>
<th>Work Order #:</th>
<th>Date OUT::</th>
<th>Supervisor Inital OUT:</th>
<th>Comments/Tradesmen:</th>
</tr>
</thead>
<tbody>
<td>
    <input type="text" name="lock_number" id="locknumber" 
  required="required">
    </td>
<td>
    <input type="text" name="equipment_number" id="equipmentnumber" 
 required="required">
</td>
<td>
    <input type="text" name="work_order" id="workorder" required="required">
</td>
<td>
    <input type="date" name="date_out" id="dateout" required="required">
</td>
<td>
    <input type="text" name="supervisor_out" id="supervisorout" 
required="required">
</td>
<td>
    <input type="text" name="comments_out" id="commentsout" 
required="required">
 </td>
 </tbody>
 </table>       
<input type="submit" value="Submit" >
 <br><br>
  <a href="http://152.116.203.115/lockcheckin2.php" target="_blank">Lock 
  Check 
  In 
  Form</a>
  <a href="http://152.116.203.115/dataout.php" target="_blank">Lock Check Out 
   History</a>
  </body>
  </html>

这是我的insert.php文件，试图返回成功提交的消息，但保留在相同的URL。 

<?php
/* Attempt MySQL server connection. Assuming you are running MySQL
server with default setting (user 'root' with no password) */
$link = mysqli_connect("localhost", "nick", "ramon", "lockout");

// Check connection
if($link === false){
die("ERROR: Could not connect. " . mysqli_connect_error());
}

// Escape user inputs for security
$lock_number = mysqli_real_escape_string($link, $_REQUEST['lock_number']);
$equipment_number = mysqli_real_escape_string($link, 
$_REQUEST['equipment_number']);
$work_order = mysqli_real_escape_string($link, $_REQUEST['work_order']);
$date_out = mysqli_real_escape_string($link, $_REQUEST['date_out']);
$supervisor_out = mysqli_real_escape_string($link, 
$_REQUEST['supervisor_out']);
$comments_out = mysqli_real_escape_string($link, $_REQUEST['comments_out']);
$date_in = mysqli_real_escape_string($link, $_REQUEST['date_in']);
$supervisor_in = mysqli_real_escape_string($link, 
$_REQUEST['supervisor_in']);


 // attempt insert query execution
 $sql = "INSERT INTO form (lock_number, equipment_number, work_order, 
 date_out, 
  supervisor_out, comments_out, date_in, supervisor_in) VALUES 
   ('$lock_number','$equipment_number', '$work_order', '$date_out', 
 '$supervisor_out', '$comments_out', '$date_in', '$supervisor_in')";
 if(mysqli_query($link, $sql)){
 echo "Submit Successful";
sleep(1); 
header("location: index.php");
header("Location:http://152.116.203.115/lockcheckoutbeta.php");
} 
else{
echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
 }

// close connection
mysqli_close($link);
?>

我只希望弹出一条消息，提示“提交成功”，然后清除字段，以便可以将其他锁定示例输入到字段中。如果有人可以帮助我，那就太好了！谢谢。

4 个答案:

答案 0 :(得分：1)

首先，您应该整理HTML。您没有关闭标签（form标签和input标签），并且表中没有任何行。当我打开页面时，页面看起来很奇怪。

我清理了您的html并添加了javascript代码。 代码使用jQuery。。如果提交了表单，则处理程序将返回false，这将阻止提交表单。同时，（异步）ajax请求正在启动并定位您的php文件。它包含输入数据作为POST / GET数据，具体取决于表单的method属性。如果ajax完成，则执行success和error回调。

注意：由于没有insert.php，这显然在这里不起作用。

此外，您还必须修改insert.php。不要设置新的location标题。这将使ajax请求混乱。只需打印错误或成功消息，而无需重定向。

$(document).ready(function(){
	$('form').on('submit', function(){
		var data_array = $(this).serializeArray();
		var data = {};
		var method = $(this).attr('method');
		var action = $(this).attr('action');
		
		if(typeof method != 'string'){
			method = "POST";
		}
		if(typeof action != 'string'){
			action = window.location.href;
		}
		
		for(var i = 0; i < data_array.length; i++){
			data[data_array[i]["name"]] = data_array[i]["value"];
		}
		
		console.log(data);
		
		$.ajax(action, {
			data: data,
			// dataType: "html",
			success: function(rtrn){
				alert("Data inserted!");
			},
			error: function(){
				alert("Error, could not reach server '" + action + "'!");
			}
		});
		
		return false;
	});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h3> *All fields must be populated </h3>
<form action="insert.php" method="post">
  <table style="width: 100%;">
    <tr>
      <td>Lock Number</td>
      <td>
        <input type="text" name="lock_number" id="locknumber" required="required" />
      </td>
    </tr>
    <tr>
      <td>Equipment # or description:</td>
      <td>
        <input type="text" name="equipment_number" id="equipmentnumber" required="required" />
      </td>
    </tr>
    <tr>
      <td>Work Order #:</td>
      <td>
        <input type="text" name="work_order" id="workorder" required="required" />
      </td>
    </tr>
    <tr>
      <td>Date OUT::</td>
      <td>
        <input type="date" name="date_out" id="dateout" required="required" />
      </td>
    </tr>
    <tr>
      <td>Supervisor Inital OUT:</td>
      <td>
        <input type="text" name="supervisor_out" id="supervisorout" required="required" />
      </td>
    </tr>
    <tr>
      <td>Comments/Tradesmen:</td>
      <td>
        <input type="text" name="comments_out" id="commentsout" required="required" />
      </td>
    </tr>
  </table>       
  <input type="submit" value="Submit" />
  <br />
  <br />
  <a href="http://152.116.203.115/lockcheckin2.php" target="_blank">Lock Check In Form</a>
  <a href="http://152.116.203.115/dataout.php" target="_blank">Lock Check Out History</a>
</form>

编辑：这段代码（基本上）在做什么

您的问题不是一个基本的问题。 您发布的代码是网页和表单工作方式的“一般”方式。您可以这样想象：

  1. 用户在您的设施部门锁定结帐输入表页面上
  2. 用户输入您输入的值，然后点击submit
  3. 客户（=用户）收集输入中的数据并定位到input.php
  4. input.php处理您的输入数据
  5. input.php生成新的html输出

这意味着，如果您正在使用input.php中的数据，则用户必须位于input.php网页上！如果用户不打开php文件，绝对没有办法执行。因此，您的用户必须处于input.php页上。

我建议的解决方案是使用ajax。您可以将其视为用户的“克隆”。他正在后台打开input.php页面。您将看不到input.php的html输出（在您呈现的DOM中）。现在的过程是：

  1. 用户在您的设施部门锁定结帐输入表页面上
  2. 用户输入输入值，然后单击submit
    1. 打开ajax连接，“正在创建您的克隆”
    2. ajax（“您的克隆”）正在使用所有输入的数据访问input.php，您的用户停留在设施部门锁定结帐输入表格页面上
    3. input.php处理您的输入数据
    4. input.php生成新的html输出
    5. ajax（“用户克隆”）将输出takse并将其发送给您的真实用户
  3. 真实用户从ajax获得input.php结果，他仍在设施部门锁定结帐输入表单页面上

此代码不是基本的html代码。如果您仍在学习，请不要使用此代码。

代码建议

对于初学者，我建议另一个代码。修改您的input.php，以便它可以处理数据，但也可以显示正确的html。以下代码生成所需的html。此外，它还会检查表单是否已提交。

如果用户单击提交按钮，则表单将重新加载当前页面。 $_REQUEST被填充，因此将保存这些值。然后，将显示成功或错误消息。此后，将再次生成原始html，以便用户看到包含成功消息的页面。如果您要使用其他文件结构，请查看php's require function。

注意：我对您的php代码进行了很多更改。我使用的许多代码片段都是个人喜好。我喜欢将插入语句放置在数组中，因为我认为这是一个非常干净的代码。另外，我还以个人方式固定了您的新行和制表符样式。

我也删除了date_in和supervisor_in，因为没有定义这些值的输入字段。您也应该解决该问题。

以下代码应为您工作：

<!DOCTYPE html>
<html>
    <head>
        <link href="lockproject.css" type="text/css" rel="stylesheet">
        <title>Locks Out Form</title>
    </head>
    <body>
        <?php
            // check if the form is being submitted
            if( isset($_REQUEST['lock_number']) && isset($_REQUEST['equipment_number']) && 
                isset($_REQUEST['work_order']) && isset($_REQUEST['date_out']) && 
                // isset($_REQUEST['date_in']) && isset($_REQUEST['supervisor_in']) &&
                isset($_REQUEST['supervisor_out']) && isset($_REQUEST['comments_out'])){
                    // opening connection
                    $link = mysqli_connect("localhost", "nick", "ramon", "lockout");

                    // Check connection
                    if($link === false){
                        die("ERROR: Could not connect. ".mysqli_connect_error());
                    }

                    // prepare insert statement, the indices are the column names of your table, the values are 
                    // the corresponding values to insert
                    $insert = array(
                        'lock_number' => mysqli_real_escape_string($link, $_REQUEST['lock_number']),
                        'equipment_number' => mysqli_real_escape_string($link, $_REQUEST['equipment_number']),
                        'work_order' => mysqli_real_escape_string($link, $_REQUEST['work_order']),
                        'date_out' => mysqli_real_escape_string($link, $_REQUEST['date_out']),
                        // 'date_in' => mysqli_real_escape_string($link, $_REQUEST['date_in']),
                        // 'supervisor_in' => mysqli_real_escape_string($link, $_REQUEST['supervisor_in']),
                        'supervisor_out' => mysqli_real_escape_string($link, $_REQUEST['supervisor_out']),
                        'comments_out' => mysqli_real_escape_string($link, $_REQUEST['comments_out'])
                    );

                    // add quotes
                    $insert = array_map(function($value){
                        return "'".$value."'";
                    }, $insert);

                    // prepare sql
                    $sql = 
                        "INSERT INTO `form` (".implode(", ", array_keys($insert)).") ".
                        "VALUES (".implode(", ", $insert).");";

                    // print success/error message
                    if(mysqli_query($link, $sql)){
                        echo "Submitted successfully.";
                    } 
                    else{
                        echo "ERROR: Could not execute query. ".mysqli_error($link);
                    }

                    // close connection
                    mysqli_close($link);
            }
        ?>
        <h1>Facilities Departmental Lock Checkout Entry Form </h1>
        <div>*All fields must be populated</div>
        <form method="post">
          <table style="width: 100%;">
            <tr>
              <td>Lock Number</td>
              <td>
                <input type="text" name="lock_number" id="locknumber" required="required" />
              </td>
            </tr>
            <tr>
              <td>Equipment # or description:</td>
              <td>
                <input type="text" name="equipment_number" id="equipmentnumber" required="required" />
              </td>
            </tr>
            <tr>
              <td>Work Order #:</td>
              <td>
                <input type="text" name="work_order" id="workorder" required="required" />
              </td>
            </tr>
            <tr>
              <td>Date OUT::</td>
              <td>
                <input type="date" name="date_out" id="dateout" required="required" />
              </td>
            </tr>
            <tr>
              <td>Supervisor Inital OUT:</td>
              <td>
                <input type="text" name="supervisor_out" id="supervisorout" required="required" />
              </td>
            </tr>
            <tr>
              <td>Comments/Tradesmen:</td>
              <td>
                <input type="text" name="comments_out" id="commentsout" required="required" />
              </td>
            </tr>
          </table>       
          <input type="submit" value="Submit" />
          <br />
          <br />
          <a href="lockcheckin2.php" target="_blank">Lock Check In Form</a>
          <a href="dataout.php" target="_blank">Lock Check Out History</a>
        </form>
    </body>
</html>

答案 1 :(得分：0)

使用以下方法在insert.php的开头添加完整的lockcheckoutbeta.php：

<?php include('insert.php') ?>

在insert.php内部，检查是否使用以下命令设置了提交按钮（在commit的输入标签中添加name="lock_user"）

if (isset($_POST['lock_user']))

更改<form action="lockcheckoutbeta.php" method="post">

我基本上要做的是在开头插入完整的insert.php文件。仅当设置了提交按钮后，此文件才会运行。因此，按下“提交”按钮后，您将被重定向到相同的URL，但将显示insert.php文件。希望这就是您所需要的。

答案 2 :(得分：0)

做到这一点的最佳方法是将HTML和PHP放在同一页面上。这很容易。当我们请求网页时，浏览器使用GET方法。在表单中使用POST方法时，可以在同一页面中同时添加PHP和HTML代码，如下所示。

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
   // handle the form
}
?>
<!-- now add the html -->

请注意，您的表单应具有空的action属性，以表示浏览器要提交到同一页面

<form method="POST" action="">
    <!-- form elements -->
</form>

See the demo

此外，使用此技术还有很多优点。

  1. 您可以将所有代码保存在一页上。
  2. 您可以创建粘性表单，以在出现问题时保存以前提交的数据。 Here's the tutorial
  3. 它会根据需要自动显示同一页面。

有关更多信息，请参见this。

答案 3 :(得分：-1)

对于表单，您可以将 action 设置为

<form method="post" action="">

or    

<form method="post" action="lockcheckoutbeta.php">

然后为PHP使用 isset ，如下所示：

<?php if (isset($_POST['submit'])) {
    include 'insert.php';
} else {
    echo '
    
    <!DOCTYPE html>
<html>
<head>
<link href="lockproject.css" type="text/css" rel="stylesheet">
 <title>Locks Out Form</title>
 <h1>Facilities Departmental Lock Checkout Entry Form </h1>
 </head>
 <body>
 <h3> *All fields must be populated </h3>
 <form action="insert.php" method="post">
 <table style="width:100%">
 <thead>
<tr>
 <th>Lock Number</th>
 <th>Equipment # or description:</th>
<th>Work Order #:</th>
<th>Date OUT::</th>
<th>Supervisor Inital OUT:</th>
<th>Comments/Tradesmen:</th>
</tr>
</thead>
<tbody>
<td>
    <input type="text" name="lock_number" id="locknumber" 
  required="required">
    </td>
<td>
    <input type="text" name="equipment_number" id="equipmentnumber" 
 required="required">
</td>
<td>
    <input type="text" name="work_order" id="workorder" required="required">
</td>
<td>
    <input type="date" name="date_out" id="dateout" required="required">
</td>
<td>
    <input type="text" name="supervisor_out" id="supervisorout" 
required="required">
</td>
<td>
    <input type="text" name="comments_out" id="commentsout" 
required="required">
 </td>
 </tbody>
 </table>       
<input type="submit" value="Submit" >
 <br><br>
  <a href="http://152.116.203.115/lockcheckin2.php" target="_blank">Lock 
  Check 
  In 
  Form</a>
  <a href="http://152.116.203.115/dataout.php" target="_blank">Lock Check Out 
   History</a>
  </body>
  </html>
    
    ';

相关问题
最新问题