用jquery和php拖拽删除答案

【问题标题】：Drag and delete with jquery and php用jquery和php拖拽删除
【发布时间】：2011-08-04 06:17:51
【问题描述】：

    Product Name                            Barcode         Quantity    
    2*WHITER RIN (200 GM)                   8901030295232   null    
    2*WHITER RIN JASMINE FRESH(500 GM)      8901030295201   null
    2*WHITER RIN (200 GM)                   8901030295232   null    
    2*WHITER RIN JASMINE FRESH(500 GM)      8901030295201   null
    2*WHITER RIN (200 GM)                   8901030295232   null    
    2*WHITER RIN JASMINE FRESH(500 GM)      8901030295201   null
    2*WHITER RIN (200 GM)                   8901030295232   null    
    2*WHITER RIN JASMINE FRESH(500 GM)      8901030295201   null
    2*WHITER RIN (200 GM)                   8901030295232   null    
    2*WHITER RIN JASMINE FRESH(500 GM)      8901030295201   null
    2*WHITER RIN (200 GM)                   8901030295232   null    
    2*WHITER RIN JASMINE FRESH(500 GM)      8901030295201   null


                             Delete

这是我的表。我需要一个 jquery 函数来选择特定行，以便它应该能够拖动或选择它，当我单击删除按钮时，它应该被删除...谁能帮帮我在 jquery 和 php 中寻找解决方案

查看代码

     <?php  $i=0;
    foreach($aaa as $row)
    {$i++;
?>
    <tr>
        <!--    <td  align="left" valign="middle" bgcolor="#FFFFFF" class="rows"><?=$i?></td> -->
            <td  align="left" valign="middle" bgcolor="#FFFFFF" class="rows"><?=$row[0]?></td>
            <td  align="left" valign="middle" bgcolor="#FFFFFF" class="rows"><?=$row[1]?></td>
            <td  align="left" valign="middle" bgcolor="#FFFFFF" class="rows"><?=$row[2]?></td>

        </tr>
  <?php 
      }
      ?>

【问题讨论】：

那么，你能告诉我们你到目前为止做了什么吗？
我只能通过删除按钮删除该行
你能展示代码你是怎么做到的，这样人们就可以给你更好的建议吗？
是你的拖删除功能'当记录被拖到表外时，它被删除'？不点击“删除”按钮？
不，它不能拖动......只是通过Rauni给m的链接

标签： php codeigniter jquery

【解决方案1】：

我正在为<tr> 分配任意类“记录”<tr class="record">。以及 id='deleterecords' 的删除按钮。这些是点击和删除功能。

// assign attribute selected to clicked rows
$("tr[class*='record']").click(function() {
   // comment line below if you want multi-selected records,
   $("tr[class*='selected']").removeClass("selected");
   $(this).addClass("selected");
});

// remove selected records upon clicking delete
$("input[id='deleterecords']").click(function() {
  $("tr[class*='selected']").remove()
});

这是一个有效的实现here。至于拖动删除，我不确定用户功能。

至于你的 php 代码，而不是

 <?php  $i=0;
foreach($aaa as $row)
{$i++;
?>
  <tr>

将以下类“记录”添加到您的<tr>。

 <?php  $i=0;
foreach($aaa as $row)
{$i++;
?>
  <tr class='record'>

并确保添加以下样式并稍后将其编辑为您喜欢的样式，这只是为了标记已选择的行。

<style>
.selected {
  background-color:gray;    
}
</style>

另外，我的删除按钮的 id='deleterecords'

<input type="button" id="deleterecords" value="Delete">

【讨论】：

+1 用于拖动评论。现在，如果有一个删除框，而不是按钮，那将是有意义的。
但是当我实现这个代码时它不能选择也不能删除？？
啊，看看这个jsfiddle.net/jPEeq你可能错过了什么。我那里有 html 和 JS，还要注意 jquery 1.6.2 和 jquery ui 1.8.14 包括在内。
我检查了...代码...你能告诉我如何实现这个代码，如上所示的问题中的视图代码

【解决方案2】：

这是 php.ini 中的完整代码。我从 <td> 中删除了 bgcolor 属性，因为它覆盖了 selected 类中的背景颜色。

<head>
<script src="http://code.jquery.com/jquery-1.6.2.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.js"></script>
<style>
.selected {
  background-color:gray !important;
}
</style>

</head>
<?php
$aaa = array();
$aaa[] = array(1, "Data One", "Data Two");
$aaa[] = array(2, "Data Three", "Data Four");
$aaa[] = array(3, "Data Five", "Data Five");
$aaa[] = array(4, "Data AAA", "Data BBB");
$aaa[] = array(5, "Data AAAAAA", "Data SSSSBBB");
?>

<table border=1>
<tr class='record'>
  <td  align="left" valign="middle" bgcolor="#FFFFFF" class="rows">Row</td>
  <td  align="left" valign="middle" bgcolor="#FFFFFF" class="rows">Data 1</td>
  <td  align="left" valign="middle" bgcolor="#FFFFFF" class="rows">Data 2</td>
</tr>

<?php  $i=0;
  foreach($aaa as $row)
  {$i++;
?>
<tr class='record'>
  <td  align="left" valign="middle" class="rows"><?=$row[0]?></td>
  <td  align="left" valign="middle" class="rows"><?=$row[1]?></td>
  <td  align="left" valign="middle" class="rows"><?=$row[2]?></td>
</tr>
<?php } ?>
</table>
<input type="button" id="deleterecords" value="Delete">

<script type="text/javascript">
$(document).ready(function() {

  // assign attribute selected to clicked rows
    $("tr[class*='record']").live('click', function() {
       // comment line below if you want multi-selected records,
       $("tr[class*='selected']").removeClass("selected");
       $(this).addClass("selected");
    });

    // remove selected records upon clicking delete
    $("input[id='deleterecords']").live('click', function() {
      $("tr[class*='selected']").remove();
    });
});
</script>

【讨论】：

【解决方案3】：

看看这个教程：

http://robertfrew.wordpress.com/2010/03/25/drag-drop-sort-delete-with-jquery-jqueryui/

【讨论】：