选择正确的变量php/javascript

我有一个愿望清单，我建。它的功能正确地添加/显示/删除项目，但我想进一步。当我删除一个项目时，我希望它有一个弹出窗口，提示“项目X已被删除”。选择正确的变量php/javascript

它内置于一个HTML table内部，该接口从foreach生成变量。

我的问题：成功删除任何项目后，JS提示将只抓取第一个列出的项目的值。

I.E.如果我点击任何项目的删除，它会每次回显第一个项目的变量。但它确实每次都删除正确的。

HTML

`echo '<tr > 
        <td > 
         '.$shirt_name.' 
        </td> 
        <td> 
         '.$model_number.' 
        </td> 
        <td style="padding-left:9px;"><div style="height:50px;background-size:contain;" class="'.$shirt_image.'"> 
         </div> 
        </td> 

     ';    
     ?> 
       <? echo '<td> 
       <form action="delete_button.php" method="post"> 
       <input type="hidden" id="deleteitem" class="testbtn" name="deleteitem" value="'.$delete_shirt. '"> 
       <input type="submit" id="del_but" value="Remove" class="deleteBtn"> 
       </form></td>     
       ';

的Javascript为了简洁起见，在这里我只是想用
class="testbtn"

<script> 
$('.deleteBtn').click(function() {  
var deleteitem = $(".testbtn").val(); 
alert (deleteitem); 
}); 
</script>`

所以呼应输入的值，这只是提示第一个列出的价值<tr>而不是我点击的相对位置。我如何让它抓住相对值？我希望我足够清楚！

来源

2013-07-23 Ghost Echo

尝试'$（本）.closest（ “TR”）删除。（）;'在点击处理程序 – Orangepill

我试过了，它没有任何区别。它仍然抓住第一个值... –

也许var deleteitem = $（this）.prev（）。val（）; –

试试这个

<script> 
$('.deleteBtn').click(function() { 
var deleteitem = $(this).parent().find('.testbtn').val(); 
alert (deleteitem); 
}); 
</script>

来源

2013-07-23 15:23:51

这正是我一直在寻找的。你能简单地解释一下它在做什么吗？ –

$（this）选择被单击的deletebtn元素对象，parent（）选择他的td父对象，find找到tesbtn作为其类的元素对象（在上一次选择的td上下文中），val（）获取值选定的testbtn –

使用$(this) $（this）是当前单击的按钮对象。试着做一个console.log（$（this））来看看它有什么。如果你需要选择其父行ID或其他东西$(this).parent("tr").attr("ID")

希望这会有所帮助！ *无双关语

来源

2013-07-23 15:17:17 Bil1

$（this）.parent（'tr'）'只会匹配点击处理程序在td上的内容，您可能意指'$（this）.parent（'td'）。parent（'tr'）' – Orangepill

这里是一个模板，显示你应该如何做到这一点。

<script> 
$('.deleteBtn').click(function(e) { 
    e.preventDefault(); 
    if (window.confirm("Are you sure you want to delete?")) { 
     // do ajax to delete on the server 
     $(this).closest("tr").remove(); 

    } 
}); 
</script>

要剖析一个处理器内这条线$(this).closest("tr").remove();

$(this)将返回接收到事件

.closest("tr")会给你选择匹配的第一个祖先元素tr

.remove()将删除dom节点。

来源

2013-07-23 15:18:39 Orangepill

谢谢，但这不是我一直都没有找到的。如果我在提示上单击“取消”，它仍然会从数据库中删除该项目。 –

是啊......我明白了......你不是在做ajax，而是为了这个。由于您正在进行传统的发布，所以页面只是在缺少已删除项目的情况下重新呈现。 JS与这个无关......所以还有更多的测试。 – Orangepill

无论如何，我将不得不使用AJAX，因为我希望div重新加载，显示没有刷新页面的新表。但是现在我一次只采取一步。我也可能需要帮助，所以请注意不久的将来！再次感谢;-) –

更新

看我的代码，并期待在其他两个项目和尝试，并把它们粘在一起。

你真的需要重构这段代码，当你使用javascript做点击事件时，你为什么会把按钮包装错误？如果你做这样的事情会更好：

<?php 
    echo "<tr> 
     <td> 
      $shirt_name 
     </td> 
     <td> 
      $model_number 
     </td> 
     <td style=\"padding-left:9px;\"> 
      <div style=\"height:50px;background-size:contain;\" class=\"$shirt_image\"></div> 
     </td> 
     <td class=\"testbtn\" id=\"$model_id\"> 
      Delete 
     </td>";    
?> 

<script> 
$('.deleteBtn').click(function() { 
var id = $(this).attr('id'); 

// DO SOME AJAX AND PUT THE ALERT IN THE SUCCESS 

alert ('Deleted' + id); 
}); 
</script>

来源

2013-07-23 15:18:54

是否有列表中每个衬衫的“删除按钮”表单？如果是这样，那么你可以添加警告（）调用提交按钮，如下所示：

<form> 
    <input type="submit" onclick="alert('Click!'); return true;"> 
</form>

来源

2013-07-23 15:23:00 mvanlamz

我需要做的不仅仅是提醒静态文本... –

选择正确的变量php/javascript

回答

相关问题