时间戳

首页 > 解决方案 > 在 html 中访问 mysql 值以通过 jquery 发送到 php 文件

php - 在 html 中访问 mysql 值以通过 jquery 发送到 php 文件

问题描述

我想获取 id 的值，以便我可以根据 id 号从 mysql 中删除数据

这是一个事件的项目，这里的主要思想是我想根据点击的按钮获取事件的id号，以便我可以根据id号更新/删除事件。

显示细节的代码 

  <?php $sql= "SELECT event_name, event_date, event_id FROM events WHERE event_status=0";
  $result= mysqli_query($conn, $sql);?>

  while($row = mysqli_fetch_assoc($result))
{
   echo ' 

      <div class="pending-card">

        <div class="pending-image">

        </div>';

     echo "  <div class='pending-title'>
          <h1>{$row["event_name"]}</h1>
        </div>";

       echo " <div class='pending-des'>
          <p>{$row["event_date"]}</p>
          <button class='choice-pending'><a href='detail.php'>Read More...</a></button>
          <input style='display: none;' type='text' id='test-pend' value='{$row["event_id"]}'>
        </div>

      </div>
    ";
}

jQuery代码

在这里，我尝试通过发出警报来检查这是否有效，但是在我按下按钮后，出来的 ID 号与我单击的按钮不对应

$(document).ready(function(){

$('.choice-pending').click(function(){
    alert("Value: " +  $('#test-pend').val());

});
});

谁能告诉我哪里出错了

例如，我按下的事件假设为 34，但警报显示 26，这是代码中用于显示详细信息的第一个事件 id

标签： phpjquerymysqlajax

解决方案

您可以在元素中使用data-*属性。

基于https://www.w3schools.com/tags/att_global_data.asp

data-* 属性用于存储页面或应用程序私有的自定义数据。

data-* 属性使我们能够在所有 HTML 元素上嵌入自定义数据属性。

然后可以在页面的 JavaScript 中使用存储的（自定义）数据来创建更具吸引力的用户体验（无需任何 Ajax 调用或服务器端数据库查询）。

data-* 属性由两部分组成：

属性名称不应包含任何大写字母，并且必须在前缀“data-”之后至少有一个字符 属性值可以是任何字符串 注意：以“data-”为前缀的自定义属性将被用户代理完全忽略.

<button class="choice-pending" data-event-id="<?= $row['event_id']; ?>">Read More...</button>

然后在您的脚本中，您可以访问单击的按钮：

$(".choice-pending").click(function() {
    if($(this).attr('data-event-id') !== undefined) {
        // You can do ajax call here to your detail.php

        // Or you can simply create a hidden field inside your form, assigned the data-event-id value to it, then $("form").submit(); 

    } else {
        /** Error message here, maybe? */

    }

});

推荐阅读