Php 弹出窗口,显示数据库中的条目列表,可在按下编辑按钮时从中进行选择

Php 弹出窗口,显示数据库中的条目列表,可在按下编辑按钮时从中进行选择,php,view,edit,popupwindow,buttonclick,Php,View,Edit,Popupwindow,Buttonclick,我正在尝试设计维护申请表,它能够在数据库表中添加、查看、编辑和删除数据。im正在配置编辑和查看按钮。我希望它能够获取数据库中保存的所有请购单,并在弹出窗口中显示列表。我还希望能够点击列表中的任一数据,并在申请表中显示所有详细信息。从那里,我希望能够编辑详细信息并再次保存 问题:我已经搜索了论坛,但没有找到一个如何做的起点。你们帮了我的忙,相信我会回来寻求帮助 这是我的密码: requisionform.php <?php include("session.php");//include s

我正在尝试设计维护申请表,它能够在数据库表中添加、查看、编辑和删除数据。im正在配置编辑和查看按钮。我希望它能够获取数据库中保存的所有请购单,并在弹出窗口中显示列表。我还希望能够点击列表中的任一数据,并在申请表中显示所有详细信息。从那里,我希望能够编辑详细信息并再次保存

问题:我已经搜索了论坛,但没有找到一个如何做的起点。你们帮了我的忙,相信我会回来寻求帮助

这是我的密码:

requisionform.php

<?php
include("session.php");//include session to know logged in user

//check if submit button has been pressed
if(isset($_POST['submit'])){

//make a connection to server and database
include("DBconnect.php"); 

//define variables

$area_of_use=$_POST["area_of_use"];
$machine_name=$_POST["machine_name"];
$machine_code=$_POST["machine_code"];
$area=$_POST["area"];
$type=$_POST["type"];
$priority=$_POST["priority"];
$description=$_POST["description"];
$deadline=$_POST["deadline"];

//Save data into database

$sql="INSERT INTO requisition_table (
reqNo,RequestingDepartment,MachineName,
MachineCode,ForwardArea,MaintType,MaintPriority,
ProblemDescription,Deadline,RequestedBy,ReqDate)
VALUES (default,'$area_of_use','$machine_name',
'$machine_code','$area','$type','$priority',
'$description','$deadline','$login_session',now())";

$result=mysqli_query($con, $sql);

}

?>

<!DOCTYPE html>

<head>
<title>ZEKOmaint</title>

<style>
button {
width:1.8cm;
align:center;

}
.2{
align:center;
}

</style>
<?php
require "disablerequestform.php";
require "onchange.php";
require "req.php";
?>

<script src='https://code.jquery.com/jquery-2.1.3.min.js'></script>
</head>

<body>

<?php
if(isset($_POST['submit'])){
if ($result) {
echo "<script type='text/javascript'>alert('submitted successfully!')  </script>";
}
else
{
echo "<script type='text/javascript'>alert('failed!')</script>";
}
}
?>

<fieldset style="width:19cm;">
<legend><b>Maintenance Requistion</b></legend>

<fieldset id="2">
<button onclick="grayer('request',false);">ADD</button>
<button>VIEW</button>
<button>EDIT</button>
<button>DEL</button>
<input type="submit" name="submit" form="requestform" value="SAVE">
<button onclick="document.location.href='requisitionform.php'">CANC</button>
<button onclick="document.location.href='logout.php'">EXIT</button>
<button>PRINT</button>


</fieldset>
<br />
<form id= "requestform" action="requisitionform.php" method="POST">
<div id="request">
<table id="table1">
<tr><td>Requisition No.</td><td> <input type="int" name="req" size="10" id="req"></td>
<td>Requisition Date:</td><td><input type="date" name="date" size="10" value="<?php echo date('d-m-Y');?>"></td></tr>

<tr><td>Requesting Department: </td><td>

<select class="form-control" name="area_of_use" id='area_of_use' required>
  <option value="" selected></option> 

<option value="Wire Galvanizing">Wire Galvanising</option>
<option value="Wire Drawing">Wire Drawing</option>
<option value="Barbed Wire">Barbed Wire</option>
<option value="Utilities">Utlities</option>

</select>
</td>   
<td>Forward to Area: </td><td><select name="area" required> 
    <option value="" selected></option>
<option value="Maintenance">Maintenance</option>

</select></td></tr>
<tr><td>Machine Name:</td>
<td><select name="machine_name" id="machine_name" class="form-control" required>



</select>
<script src='fetch.js'></script> 

</td>
<td>Maintenance type:</td><td><select name="type" required> 
   <option value="" selected></option>
<option value="Preventive"> Preventive</option>
<option value="Corrective">Corrective</option>
<option value="Breakdown">Breakdown</option>
</select></td></tr>
<tr><td>Machine Code:</td><td><select name="machine_code" id = "machine_code" required></select> </td>
<script src='fetch2.js'></script> 

<td>Maintenance Priority:</td><td><select name="priority" required> 
    <option value="" selected></option>
<option value="High" > High</option>
<option value="Moderate">Moderate</option>
<option value="Low">Low</option>
</select></td></tr>
</table>
<table id="table2">
<tr><td>Problem Description:</td> <td><textarea rows="2" cols="73"
name="description" required="required"> </textarea></td></tr><br>
<tr><td>Deadline Time: </td> <td><input type="text" name="deadline" required></td></tr><br>
<tr><td>Cancel Remarks:</td> <td> <textarea rows="1" cols="73" name="cancel"></textarea></td></tr><br>
</table>

Requested by:<input type="text" name="asked" value="<?php echo $login_session;?>"<br>
Approved by:<input type="button" name="authorise" value="Authorise"><input type="text" name="approve">

</div>
</form>
</fieldset>

</body>
</fieldset>

</html>

您可能希望使用免费的dataTables框架(jQuery)。这将使您有机会在结果表中选择行,并显示所选条目的更多详细信息(您可能尚未在主表中显示)

您可以使框架对定义的按钮函数作出反应

它还实现了搜索、分页等功能

为了类似的目的,我在两个项目中使用了这个框架。我没有在弹出窗口中使用它,但这应该是可能的

链接:

<script type="text/javascript">
function grayer(formId, yesNo) {
var f = document.getElementById(formId), s, opacity;
s = f.style;
opacity = yesNo? '40' : '100';
s.opacity = s.MozOpacity = s.KhtmlOpacity = opacity/100;
s.filter = 'alpha(opacity='+opacity+')';
for(var i=0; i<f.length; i++) f[i].disabled = yesNo;
}
window.onload=function(){grayer('request',true);}; // disabled by default
</script>
<?php
require 'DBconnect.php';

$sql = 'SELECT * FROM machines_table';

// Prepare the statement.
$statement = mysqli_prepare($con, $sql);

// Execute the statement.
mysqli_stmt_execute($statement);

// Get the result set from the prepared statement.
$result = mysqli_stmt_get_result($statement);

// Fetch the data and save it into an array for later use.
$details = mysqli_fetch_all($result, MYSQLI_ASSOC);

// Free the memory associated with the result.
mysqli_free_result($result);

// Close the prepared statement. It also deallocates the statement handle.
mysqli_stmt_close($statement);
?>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $('#machinecode').change(function (event) {
                var machine = $(this).val();

                if (machine === 'Select') {
                    $('#machinename').val('');

                } else {
                    $.ajax({
                        method: 'get',
                        dataType: 'json',
                        url: 'getinforeq.php',
                        data: {
                            'machine': machine
                        },
                        success: function (response, textStatus, jqXHR) {
                            if (!response) {
                                alert('No client data found.');
                            } else {
                                $('#machinename').val(response.machinename);

                            }
                        },
                        error: function (jqXHR, textStatus, errorThrown) {
                            alert('An error occurred. Please try again.');
                        },
                        cmplete: function (jqXHR, textStatus) {
                            //...
                        }
                    });
                }
            });
        });
    </script>