Question

在我的应用程序中，结果显示为表格格式。

我的部分代码是，

{% for device in devices %}
  <tr>
    <td>{{ device.operator}}</td>
    <td>{{ device.state }}</td>
    <td>{{ device.tstampgps }}</td>
    <td><button id='rec_delete'>Delete</button></td>

  </tr>
{% endfor %}

即使按下删除按钮，我也需要从数据库中删除特定记录。在此之前，我想提示一个确认框。任何人都可以帮助我吗？

Answer 1

由于我不知道Django，这不包括删除部分，我假设您将AJAXify（执行异步请求删除）。我也在这里单独显示$devices和$deletes变量作为局部变量，或多或少，以便您可以看到如何存储引用，然后从这些引用中工作（我相信这是一个更好的实践而不是一遍又一遍地重新选择。

还要注意使用：

jQuery(document).ready(function r($){

我在全局范围内使用jQuery()，在较大的应用程序中，您应该始终保持与可能使用$()的其他库/框架冲突。这也是一种最佳实践，您可以在该匿名函数（闭包）中使用$()。最好习惯这样做，IMO。

<table>
    <thead>
        <tr>
            <th>Operator</th>
            <th>State</th>
            <th>T-Stamp GPS</th>
            <th>&nbsp;</th>
        </tr>
    </thead>
    <tbody>
        <tr class="device">
            <td>Verizon</td>
            <td>OK</td>
            <td>033830928</td>
            <td>
                <button type="button" id="d001" class="delete">Delete</button>
            </td>
        </tr>
        ...
    </tbody>
</table>

注意

我参考$self做了一个轻微但重要的更改，因为在success超出范围后，AJAX将运行this处理程序：

jQuery(document).ready(function r($){ var $devices = $('tr.device'), $deletes = $devices.find('button.delete'); $deletes.click(function d(){ var $self = $(this).parents('tr.device'), del = confirm('Delete device?'); if (del) { // Do $.ajax() request, maybe using the // clicked button's ID. Or you could put // the row to delete ID on the TR element. // And then on success of the AJAX, run: $self.fadeOut(500, function f(){ $self.remove(); }); } }); });

http://jsfiddle.net/wMqr8/2

Answer 2

添加一个唯一的记录标识符，您可以将该标识符与DB关联到该按钮。确认后，您使用AJAX将此标识符发送到服务器，并且删除数据库的服务器代码。还要在重复元素上将ID更改为类，因为ID必须是唯一的

HTML

<tr>
    <td>{{ device.operator}}</td>
    <td>{{ device.state }}</td>
    <td>{{ device.tstampgps }}</td>
    <td><button class='rec_delete'  data-record_id="{{ device.DB_ID }}">Delete</button></td>

  </tr>

JS

$('button.rec_delete').click(function(){
     /* data() method reads the html5 data attribute from html */
     var record_id=$(this).data('record_id');

     if( confirm( 'Are you sure') ){
        $.post( 'serverPage.php', { id: record_id}, function(){
            /* code to run on ajax success*/
          $(this).closest('tr').remove();
        })
    }
})

服务器将像使用任何其他表单元素名称一样接收帖子密钥id

Answer 3

您可以向JavaScript添加点击事件，如果用户选择“确定”按钮，您可以向视图发送请求，以处理删除记录或其他任何内容

Answer 4

试试这个：

<button id='rec_delete' onclick="return confirm('Are you sure?')">Delete</button>

生成删除确认框

4 个答案: