无法在jQuery ajax表数据中使用按钮onclick调用函数

时间:2018-10-01 15:51:37

标签: javascript jquery ajax

我正在尝试对动态表行数据执行删除操作。由于某些原因,当我单击删除按钮时,未调用删除功能!这段代码有什么问题,如果有的话,请告诉我。

我仍然是初学者。

data = "";

// to delete

delete_ = function(user_email) {
  alert("inside delete");
};

myfunction = function() {
  $(".tablecontainer").show();
  load();
};

load = function() {
  $.ajax({
    url: "updatedservicerequests",
    type: "POST",
    data: {},
    success: function(response) {
      alert(response.message);
      data = response.data;
      alert(response.data);
      $(".tr").remove();
      alert(response.data);
      $(function() {
        for (i = 0; i < response.data.length; i++) {
          $("#table").append("<tr> <td> " + response.data[i].user_email + " </td> <td> " + response.data[i].booking_number + " </td> <td> " + response.data[i].booking_address + " </td> <td> " + response.data[i].booking_date + " </td> <td> " + response.data[i].booking_message + " </td> <td> " + response.data[i].request_date + " </td> <td> " + response.data[i].chosen_emails_1 + " </td> <td> " + response.data[i].chosen_emails_2 + " </td> <td> " + response.data[i].chosen_emails_3 + " </td> <td> <button onclick='edit(" + response.data[i].user_email + ");'> Edit </button> <br>    <button onclick='delete_(" + response.data[i].user_email + ");'> Delete </button> </td> </tr>");
        }
      });
    },

    error: function(response) {
      alert("unable to pull up any service request");
    }
  });

  //to prevent (contact-submit) button from submitting form data since submit button has default action of submitting form

  $(document).ready(function() {
    $("#contact-submit").click(function(e) {
      return false;
    });
  });
};
<button onclick="myfunction();">Go</button>
<div class="tablecontainer" style="display: none;">
  th&gt;
  <table border="1" id="table">
    <tr>
      <th>booking_email</th>
      <th>booking_number</th>
      <th>booking_address</th>
      <th>booking_date</th>
      <th>booking_message</th>
      <th>when the request was made</th>
      <th>requested_tech_1</th>
      <th>requested_tech_2</th>
      <th>requested_tech_3</th>
      <th>operations</th>
    </tr>
  </table>
</div>

1 个答案:

答案 0 :(得分:0)

您的问题有一个相对简单的解决方案。我个人使用了名为here

的名为DataTables的jQuery表插件

我鼓励您研究它,因为它绝对是一个强大的工具。关于您的主要问题“如何删除表中的一行数据?”这比较简单。因此,您可以使用jQuery的<div class="tooltip" data-placement="top" style="left: 364.688px; top: 266.422px;">Watch out for that first step, it's a doozie! -- Ned Ryerson</div> 而不是使用for循环遍历数据,这也非常容易。我将在这里向您展示此方法,如果您想查看DataTables版本,可以在以后的响应中添加更多内容。

.each

我希望这对您的问题有所帮助。让我知道它是否对您有帮助/有用。