Question

我从mysql数据库中获取了数据表中的许多数据行。该表的最后一列将显示一个按钮，并且我从数据库中添加了该按钮的ID作为唯一ID。当有人单击该按钮时，使用jquery将在该数据表的右侧显示该特定ID中来自数据库的更多详细数据。

我拥有的html代码

<tr><td>John Doe</td><td><button class="btn btn-success" id="<?php print($sms_id) ?>"> Details</button></td><tr>

我想获取具有对应ID的数据至下表

<table id="details_sms" class="table table-bordered table-striped">                      
          <tbody id="showdetails">
            <tr><td>From: </td><td></td></tr>
            <tr><td>Amount: </td><td></td></tr>
            <tr><td>Transaction ID:</td><td></td></tr>
            <tr><td>Rec Number: </td><td></td></tr> 
            <tr><td>Full SMS text: </td><td></td></tr>
            <tr><td><button class="btn btn-general">Previous</button> </td><td><button class="btn btn-general">Next</button></td></tr>                              
          </tbody>                      
    </table>

Ajax

$.ajax({
  method: "POST",
  url: "{fetch_details.php}}",
  data: {id = "" } 
})
  .done(function( msg ) {
     $("showdetails").html(result); 
  });

fetch_detail.php

<?php 
require_once("connection.php");
include("functions.php");


 $get_sms_info = mysqli_query($connect,"SELECT * FROM sms_in");



while($result = mysqli_fetch_array($get_sms_info,MYSQLI_ASSOC)){
                    $sms_id = $result['id'];
                    $sms_text = $result['sms_text'];
                    $sms_time = $result['sent_dt'];
                    $sender_number = $result['sender_number'];

                preg_match_all('/(\S+)\s+from\s+(\d+).*Fee\s+Tk\s+(\S+)\..*([a-zA-Z0-9]{10})\s+at\s+(.*)/', $sms_text, $matches);

?>
<tr>

                            tr><td>From: </td><td><?php print($matches[5][0]);?></td></tr>
                    <tr><td>Amount: </td><td><?php print($matches[2][0]);?></td></tr>
                    <tr><td>Transaction ID:</td><td><?php print($matches[1][0]); ?></td></tr>
                    <tr><td>Rec Number: </td><td><?php print($matches[4][0]); ?></td></tr>  
                    <tr><td>Full SMS text: </td><td>$sms_text</td></tr>
                    <tr><td><button class="btn btn-general">Previous</button> </td><td><button class="btn btn-general">Next</button></td></tr>      




</tr>
<?php
}

?>

“下一个和上一个”按钮还将加载与上一个ID对应的数据。

如何使用jquery做到这一点？

Answer 1

不要害怕按功能分开。您永远不会知道它会派上用场。

JS

function addRowToSmsDetailsTable(rowDataFromBackEnd) {
   let html = '<tr><td>' + rowDataFromBackEnd.col1 + '....</td></tr>';
   $('#details_sms tr:last').after(html);
}


$.ajax({
  method: "POST",
  dataType: 'json', // waiting for json response
  url: "fetch_details.php",
  data: {
      id: 1
  },
  success: addRowToSmsDetailsTable // success response handler
});

PHP

<?php 
require_once("connection.php");
include("functions.php");

header('Content-Type: application/json'); /* set content type because ajax waiting for json */

define('SMS_INFO_REGEX', '/(\S+)\s+from\s+(\d+).*Fee\s+Tk\s+(\S+)\..*([a-zA-Z0-9]{10})\s+at\s+(.*)/');

$get_sms_info = mysqli_query($connect, "SELECT * FROM sms_in");
$resultArray = [];
while($result = mysqli_fetch_array($get_sms_info,MYSQLI_ASSOC)){
    preg_match_all(SMS_INFO_REGEX, $sms_text, $matches);
    $resultArray[] = [
        'id'            => $result['id']
        'from'          => $matches[5][0],
        'amount'        => $matches[2][0],
        'transactionId' => $matches[1][0],
        'recNumber'     => $matches[4][0],
        'smsText'       => $result['sms_text']
    ];
}

echo json_encode($resultArray);                  
?>

Json在这里用于标准化与外部和内部接口的互操作性。 AJAX将json作为JS对象读取，并且您的关联PHP数组将在JS函数中作为对象可用（因为我们指定了dataType：json）。我没有检查此代码，但我认为一切正常。但是，我的建议是：尽可能避免使用正则表达式。

单击按钮使用jQuery从MySQL获取数据

1 个答案: