Question

我正在使用PHP函数将任何2D PHP数组格式化为HTML表，在该表中我需要在每一行中添加一个删除按钮，因此当用户单击删除按钮时，jQuery应该采用特定字段（3个字段）并在一个php文件中提交它应该给出响应而不重新加载页面，我在相同的PHP文件中有几个动态表，所以我使用$ table_name作为表单ID来区分FORMS，并在del.php中（其中我的表单已提交）我决定使用PRIMARY KEY查找哪一个表来删除该行。我的问题是我是否必须在每个表中创建表单才能执行此任务？或者我可以简单地放一些字段并使用jQuery提交表单？

任何帮助都会非常明显。

function formatArrayToTable($foo, $deletable = 0, $restaurant_id ='', $table_name = '') {
  //open table
  echo '<table class="imagetable">';

  // our control variable
  $first = true;

  foreach($foo as $key1 => $val1) {
    //if first time through, we need a header row
    if($first){
      echo '<tr>';
      foreach($val1 as $key2 => $value2) {
        echo '<th>'.$key2.'</th>';
      }

      if($deletable) {
        echo "<th>'Delete'</th>";
      }

      echo '</tr>';

      //set control to false
      $first = false;
    }

    echo '<tr>';

    foreach($val1 as $key2 => $value2) {
      echo '<td>'.$value2.'</td>';
    }

    if($deletable) {
      $primary = $val1["id"];

      echo "<input type='hidden' name='table_name' value='{$table_name}' />";
      echo "<input type='hidden' name='restaurant_id' value='{$restaurant_id}' />";
      echo "<td><input class='delete_class' type=\"button\" name=\"delete_id\" value={$primary} onclick='SubmitForm($table_name)'/></td>" ;
    }
    echo '</tr>';
  }
  echo '</table>';
}

我的Javascript功能

function SubmitForm(formId){
  var message = "";
  $("#"+formId+" input").each(function() {
    message += $(this).attr("name");
  });

  $.ajax({
    type: "POST",
    url: "del.php",
    data: message,
    success: 
      function() {
        $('#message').html("<h2>Contact Form Submitted!</h2>")
          .append("<p>Entry is Deleted </p>")
          .hide()
      }
  });
}

-Regards

Answer 1

您的问题似乎在于询问您是否可以仅使用jQuery从数据库中删除项目。传统上，据我所知，这是不可行的，因为你的数据库是服务器端的，你的jQuery是客户端的。话虽这么说，我相信一些kook已经为它创建了一个库。尽管如此，回答你的实际问题：

您需要知道如何使用jQuery来模拟从DB表中直接删除表行。下面是您需要的jQuery的一个粗略示例，当前php函数的示例输出，以及应该存在于del.php中以处理实际删除的内容。

示例表

快速说明。添加thead和tbody标签以帮助浏览器进行显示。删除onclick=""位，您正在使用jQuery，所以只需使用JavaScript块添加回调。确保您的代码将`.submittable'类（或其他描述性名称）添加到表中。你可以将整个表包装在一个表单中，然后使用像jquery form这样的插件来处理每个表单的提交，但这对于少数几个字段来说似乎有点过头了，所以我将解释如何用原料做到这一点。

<table class="imagetable submittable">
  <thead>
    <tr>
      <th>id</th>
      <th>name</th>
      <th>file</th>
      <th>meta</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <input type='hidden' name='table_name' value='secret_image_table' />
        <input type='hidden' name='restaurant_id' value='123' />
        <input class='delete_class' type='button' name='delete_id' value="Delete" />
      </td>
      <td>Silly Cat Image</td>
      <td>yarny-cat.jpg</td>
      <td>{"submitter":"De Zéro Toxin"}</td>
    </tr>
  </tbody>
</table>

jQuery代码块

从任何客户端表单，ajax或其他方式提交表名是一个可怕的想法。这是超级敏感的信息，任何程序员/黑客都可以在尝试攻击您的网站时利用这些知识。尽管如此，我不知道这个的用法，所以在你的环境中它可能没问题。但是仍然很糟糕。

// any time any element with the 'delete_class' on it is clicked, then
$(document).on('click', '.delete_class', function(e) {
  var row = $(this).closest('tr');

  var data = {
    table: $('[name="table_name"]').val(),
    id: $('[name="restaurant_id"]').val()
  };

  $.post('del.php', data, function(r) {
    // do some special stuff with your json response 'r' (javascript object)
    ...

    // do what you showed us you are doing, displaying a message
    $('#message').html("<h2>Contact Form Submitted!</h2>")
      .append("<p>Entry is Deleted </p>")
      .hide();

    // remove the row, since it is gone from the DB
    row.remove();
  }, 'json');
});

<强> del.php

再一次，table_name on submission = bad-idea。马殴打。

// define a delete function that accepts a table name an id

// define some functions to sanitize your $_POST data, to prevent SQL Injection.
// run said functions before you get to this point

// json response function, since you said you want a response from your js
function respond($data) {
  echo @json_encode($data);
  exit;
}

if (empty($_POST)) respond(array('error' => 'Invalid request')); 

$table_name = $_POST['table_name'];
$id = $_POST['id'];

$response = deleteRecord($table_name, $id);

if ($response == $what_you_expect_on_a_successful_delete) {
  // create a response message, in associative array form
  $message = array('success' => true);

  // add some other information to your message as needed
  $message['sideNote'] = 'I like waffles.';

  // respond with your message
  respond($message);
}

// if we got this far your delete failed
respond(array('error' => 'Request Failed'));

希望这有帮助。

Answer 2

如果您真的想使用jQuery直接删除数据库中的行，则需要从jQuery建立数据库连接。没有这么好的主意。相反，您应该有一个服务器端函数来完成这项工作，并使用来自jQuery的AJAX调用来调用该函数。

使用JQuery删除数据库行

2 个答案: