取消删除时,为什么取消选中复选框?

时间:2016-12-16 10:34:49

标签: jquery

这是我的完整代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SomuFinance - Personal Finance Manager</title>
    <link rel="stylesheet" type="text/css" href="indexStyle.css">
    <script src="scripts/jquery-3.1.0.min.js"></script>
</head>
<body>
    <form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
        <div id="container">
            <input type="submit" class="button" name="edit" value="Edit" />
            <input type="button" class="button" name="delete" value="Delete" />
            <input type="text" id="action" name="action">
            <table id="listDB">
                <tr>
                    <th>Select</th>
                    <th>ID</th>
                    <th>Category ID</th>
                    <th>Shop</th>
                    <th>Item</th>
                    <th>Quantity</th>
                    <th>Unit</th>
                    <th>Price Based On</th>
                    <th>MRP</th>
                    <th>Seller's Price</th>
                    <th>Last Updated On</th>
                </tr>
                <?php
                    $dbc =  mysqli_connect('localhost','root','atlantis2016','itemDB')
                                or die("Error Connecting to Database");

                    if(isset($_POST['confirmDelete']))
                    {
                        if($_POST['action']=='confirmDelete')
                        {
                            foreach ($_POST['selected'] as $delete_id) 
                            {
                                $query = "DELETE FROM grocery WHERE id = $delete_id";
                                mysqli_query($dbc, $query)
                                    or die('Error querying database.');
                            }
                        }
                    }

                    $query1 = "SELECT DISTINCT category FROM grocery";
                    $result1 = mysqli_query($dbc, $query1)
                                or die("Error Querying Database");

                    while($row = mysqli_fetch_array($result1))
                    {
                        $category = $row['category'];
                        $query2 = "SELECT * FROM grocery WHERE category='$category' ORDER BY item ASC";
                        $result2 = mysqli_query($dbc, $query2)
                                or die("Error Querying Database");

                        echo '<tr>';
                            echo '<td class="catHead" colspan=11>'.$category.'</td>';
                        echo '</tr>';
                        $catCount=1;

                        while($inRow = mysqli_fetch_array($result2))
                        {
                            $id = $inRow['id'];
                            $shop = $inRow['shop'];
                            $item = $inRow['item'];
                            $qnty = $inRow['quantity'];
                            $unit = $inRow['unit'];
                            $price_based_on = $inRow['price_based_on'];
                            $mrp = $inRow['MRP'];
                            $sellers_price = $inRow['sellers_price'];
                            $last_updated_on = $inRow['last_updated_on'];

                            echo '<tr>';
                                echo '<td><input type="checkbox" id="selected" value="' . $id . '" name="selected[]" /></td>';
                                echo '<td>'.$id.'</td>';
                                echo '<td>'.$catCount.'</td>';
                                echo '<td>'.$shop.'</td>';
                                echo '<td class="leftAligned">'.$item.'</td>';
                                echo '<td>'.$qnty.'</td>';
                                echo '<td>'.$unit.'</td>';
                                echo '<td>'.$price_based_on.'</td>';
                                echo '<td class="pri">₹'.$mrp.'</td>';
                                echo '<td class="pri">₹'.$sellers_price.'</td>';
                                echo '<td>'.$last_updated_on.'</td>';
                            echo '</tr>';

                            $catCount++;
                        }
                    }

                    mysqli_close($dbc);
                ?>
            </table>
        </div>

        <div class="dialogBG">
            <div id="deleteConfirmDialog" class="dialog">
                <div class="closeDialog"></div>
                <p>Sure you want to delete the selected Data?</p>
                <input type="submit" id="confirmDelete" class="dialogButton" name="confirmDelete" value="Delete" />
                <input type="button" id="cancelDelete" class="dialogButton cancelButton" name="cancelDelete" value="Cancel" />
            </div>
        </div>
    </form>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.button').click(function(){
                if($(this).val()=="Delete")
                {
                    $(".dialogBG").fadeIn(200);
                    $("#deleteConfirmDialog").show(200);
                    $("#action").val('confirmDelete');
                }
                else if($(this).val()=="Edit")
                {

                }
            });

            $('#confirmDelete').click(function(){
                $(".closeDialog").trigger("click");
            });
            $('#cancelDelete').click(function(){
                $("checkbox[name='selected[]']").attr('checked', false);
            });
            $(".closeDialog").click(function (e){
                $(this).parent(".dialog").hide('200').parent(".dialogBG").fadeOut('200');
            });
            $(".cancelButton").click(function (e){
                $(this).parent(".dialog").hide('200').parent(".dialogBG").fadeOut('200');
            });
            $("form").submit(function(e){
                alert("Form is being sumbitted!");
            });
        });
    </script>
</body>
</html>

问题部分是:(在PHP中)

echo '<td><input type="checkbox" id="selected" value="' . $id . '" name="selected[]" /></td>';

(以HTML格式)

<input type="button" id="cancelDelete" class="dialogButton cancelButton" name="cancelDelete" value="Cancel" />

(在jQuery中)

$('#cancelDelete').click(function(){
    $("checkbox[name='selected[]']").attr('checked', false);
});

如何在单击出现的弹出窗口中的“取消”按钮时取消选中复选框?即,当单击#cancelDelete时,如何确保取消选中名为selected []([]的复选框用于PHP目的的复选框?)

3 个答案:

答案 0 :(得分:1)

您可以添加使用removeAttr代替:

$('#cancelDelete').click(function(){
  $("input:checkbox[name='selected[]']").removeAttr('checked');
});

希望这有帮助。

&#13;
&#13;
$('#cancelDelete').click(function(){
  $("input:checkbox[name='selected[]']").removeAttr('checked');
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' name='selected[]' checked>
<input type='checkbox' name='selected[]' />
<input type='checkbox' name='selected[]' checked/>
<input type='checkbox' name='selected[]' />

<button id='cancelDelete'>Cancel</button>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

在取消按钮上,在关闭弹出窗口之前添加以下jquery

$('.myform input:checkbox').prop('checked', false);

这将全部设置为未选中。

示例:

&#13;
&#13;
$("#cancelButton").click(function() {
  $('.myform input:checkbox').prop('checked', false);
  // close the popup
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="myform">
  <input type="checkbox">Item 1
  <br>
  <input type="checkbox">Item 2
  <br>
  <input type="checkbox">Item 3
  <br>
  <br>
  <button id="cancelButton">Cancel</button>

</div>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

将选择器更改为以下内容:

$('#cancelDelete').click(function(){
    $("input[type='checkbox']:checked").attr('checked', false);
});