簡體   English   中英

如何在單擊按鈕時以可折疊的側邊欄形式填充表格行數據?

[英]How to populate table row data in collapsible sidebar form on button click?

我正在嘗試填充一個可折疊的側邊欄表單,在單擊表中特定記錄的按鈕時使用表行數據(類似於操作按鈕編輯)。 可折疊側邊欄的 HTML 位於同一個 php 頁面上。 任何人都可以幫助我編寫代碼以使用選定的行數據填充可折疊的側邊欄表單。

要求:點擊特定行的編輯按鈕時,可折疊側邊欄必須切換,並且行數據必須以側邊欄的形式顯示。

Bellow 是我的帶有可折疊側邊欄的 php 代碼

<?php

 require_once 'authentication/auth.php';
// HTML authentication
    authHTML();

  require_once "configs/config.php";
  $session_username = $_SESSION["username"];
  $query = "SELECT username, ticket_title, ticket_category, ticket_status FROM tickets_file ";
  $result1 = mysqli_query($link, $query);

  ?>
            <!-- Data list view starts -->
            <section id="data-list-view" class="data-list-view-header">
                

                <!-- DataTable starts -->
                <div class="table-responsive">
                    <table class="table data-list-view">
                        <thead>
                            <tr>
                                <th></th>
                                <th>USER NAME</th>
                                <th>TITLE</th>
                                <th>CATEGORY</th>
                                <th>STATUS</th>
                                <th>ACTION</th>
                                
                            </tr>
                        </thead>
                        <tbody>
                        <?php while($row1 = mysqli_fetch_array($result1)):;?>
                            <tr>
                                <td></td>
                                <td class="product-name"><?php echo $row1[0];?></td>
                                <td class="product-category"> <div class="chip chip-warning">
                                        <div class="chip-body">
                                            <div class="chip-text"><?php echo $row1[1];?></div>
                                        </div>
                                    </div></td>
                                <td class="product-category"><?php echo $row1[2];?></td>
                                <td class="product-name"><?php echo $row1[3];?></td>
                                <td class="product-action">
                                    <span class="action-edit"><i class="feather icon-eye"></i></span>
                                    
                                </td>  
                            </tr>
                            <?php endwhile;?>
                      
                            
                            
                        </tbody>
                    </table>
                </div>
                <!-- DataTable ends -->

                <!-- add new sidebar starts -->
                <div class="add-new-data-sidebar">
                    <div class="overlay-bg"></div>
                    <div class="add-new-data">
                        <div class="div mt-2 px-2 d-flex new-data-title justify-content-between">
                            <div>
                                <h4 class="text-uppercase">List View Data</h4>
                            </div>
                            <div class="hide-data-sidebar">
                                <i class="feather icon-x"></i>
                            </div>
                        </div>
                        <div class="data-items pb-3">
                            <div class="data-fields px-2 mt-3">
                                <div class="row">
                                    <div class="col-sm-12 data-field-col">
                                        <label for="data-name">Name</label>
                                        <input type="text" class="form-control" id="data-name">
                                    </div>
                                    <div class="col-sm-12 data-field-col">
                                        <label for="data-category"> Category </label>
                                        <select class="form-control" id="data-category">
                                            <option>Audio</option>
                                            <option>Computers</option>
                                            <option>Fitness</option>
                                            <option>Appliance</option>
                                        </select>
                                    </div>
                                    <div class="col-sm-12 data-field-col">
                                        <label for="data-status">Order Status</label>
                                        <select class="form-control" id="data-status">
                                            <option>Pending</option>
                                            <option>Canceled</option>
                                            <option>Delivered</option>
                                            <option>On Hold</option>
                                        </select>
                                    </div>
                                    <div class="col-sm-12 data-field-col">
                                        <label for="data-price">Price</label>
                                        <input type="text" class="form-control" id="data-price">
                                    </div>
                                    <div class="col-sm-12 data-field-col data-list-upload">
                                        <form action="#" class="dropzone dropzone-area" id="dataListUpload">
                                            <div class="dz-message">Upload Image</div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="add-data-footer d-flex justify-content-around px-3 mt-2">
                            <div class="add-data-btn">
                                <button class="btn btn-primary">Add Data</button>
                            </div>
                            <div class="cancel-data-btn">
                                <button class="btn btn-outline-danger">Cancel</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- add new sidebar ends -->

            </section>
            <!-- Data list view end -->

        </div>
    </div>
</div>
<!-- END: Content-->

<div class="sidenav-overlay"></div>
<div class="drag-target"></div>

我將專門使用 MySQLi 來回答我的問題。 另一種方法是使用 PDO。

我的第一個例子將通過讀取一行WHERE子句(假設用戶名是唯一下)。 如果您需要拉取所有數據並使用循環構建 HTML,以及顯示大量行數據,請參閱第二個示例。

第一個例子:

<?php
// DB variables
$servername = "DBSERVER";
$username = "DBUSER";
$password = "DBPASS";
$dbname = "DBNAME";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);

// Check connection
if($conn->connect_error){
  die("Connection failed: " . $conn->connect_error);
}

// Your session variable
$session_username = $_SESSION["username"];

/*
Since you have the username in a session variable,
you don't really need to pull the username from the database (again).
Simply use the session variable. However, I pull the username
either way since that's what you did initially.
*/

// Declare SQL query
$sql = "SELECT
            username,
            ticket_title,
            ticket_category,
            ticket_status
        FROM
            tickets_file
        WHERE
            username = ?";
            
// Prepare and bind
$stmt = $conn->prepare($sql);
$stmt->bind_param('s', $session_username);

// Execture query
$stmt->execute();

// Bind result(s) to variable(s)
$stmt->bind_result($username, $ticket_title, $ticket_category, $ticket_status);

// Fetch result(s)
$stmt->fetch();

// Close connection
$stmt->close();
$conn->close();
?>

由於我們已將數據綁定到不同的變量: $username$ticket_title ... 等。我們現在可以通過簡單地回顯變量來在任何我們認為合適的地方使用它們,例如:

<?php echo $ticket_title; ?>

第二個例子:

<?php
// DB variables
$servername = "DBSERVER";
$username = "DBUSER";
$password = "DBPASS";
$dbname = "DBNAME";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);

// Check connection
if($conn->connect_error){
  die("Connection failed: " . $conn->connect_error);
}

// Declare the query
$sql = "SELECT
            username,
            ticket_title,
            ticket_category,
            ticket_status
        FROM
            tickets_file";

// Prepare
$stmt = $conn->prepare($sql);

// Execute the query
$stmt->execute();

// Get result of query
$result = $stmt->get_result();

// Close connection
$stmt->close();
$conn->close();

// Loop through the result(s)
while ($data = $result->fetch_assoc()) {
    /*
    Then to display the results you simply echo $data['row_name_here'];
    Example: echo $data['ticket_title'];
    
    Pair that with your HTML structure and you're good to go.
    */
}
?>

我建議您查找MySQLi和/或PDO 我還建議您查找准備好的語句和參數化查詢 MySQLi 和 PDO 鏈接也涵蓋了 PHP 環境中的主題。 這將非常重要,因為它將使您的應用程序免受SQL 注入攻擊

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM