Question

当我使用jQuery Ajax加载来获取数据时，如何使用cookie记住复选框。

示例，

<div class="country">
    <?php
    $countryQuery = mysqli_query($con, "SELECT * FROM tb_country ORDER BY country_name ASC");
    while($countryFetchData = mysqli_fetch_array($countryQuery))
    {
    ?>
        <li class="selectCountry" id="<?php echo $countryFetchData['country_id']; ?>">
            <img class="thumb" src="assets/img/country/<?php echo $countryFetchData['country_image']; ?>"/>

            <div style="text-align: center; position: absolute; margin-top: 60px; width: 64px;"><?php echo $countryFetchData['country_name']; ?></div>
        </li>
    <?php
    }
    ?>
</div>

这是jQuery Ajax get team：

$('.selectCountry').click(function()
{
    var id = $(this).attr("id");

    var dataString = 'id='+id;

    $('.firstTeamList').html("<img src='assets/img/loading.gif'/>");

    $.ajax(
    {
        type: "POST",
        url: "getTeamList.php",
        data: dataString,
        cache: false,
        success: function(data)
        {
            $('.firstTeamList').show();
            $('.firstTeamList').html(data);
        }
    });
});

getTeam.php

<div class="teamList">
    <?php
    $clubsQuery = mysqli_query($con, "SELECT * FROM tb_clubs WHERE country_id_fk = '$getCountryID'");
    while($clubsFetchData = mysqli_fetch_array($clubsQuery))
    {
        <li class="teamList">
            <input type="checkbox" name="club[]" class="checkbox" id="cl<?php echo $clubsFetchData['club_id']; ?>"/>

            <label for="cl<?php echo $clubsFetchData['club_id']; ?>"><img src="assets/img/clubs/<?php echo $clubsFetchData['club_image']; ?>"/>

                <div>
                    <?php echo $clubsFetchData['club_name']; ?>
                </div>
            </label>
        </li>
    }
    ?>

<script>
  $(".checkbox").on("change", function(){
    var checkboxValues = {};
    $(".checkbox").each(function(){

      checkboxValues[this.id] = this.checked;

    });
    $.cookie('checkboxValues', checkboxValues, { expires: 7, path: '/' })
  });

  function repopulateCheckboxes(){
    var checkboxValues = $.cookie('checkboxValues');
    if(checkboxValues){
      Object.keys(checkboxValues).forEach(function(element) {
        var checked = checkboxValues[element];
        $("#" + element).prop('checked', checked);
      });
    }
  }

  $.cookie.json = true;
  repopulateCheckboxes();
</script>

我已尝试使用该代码，并且选中的复选框仅适用于每个国家/地区的首次点击。例如，如果我单击英格兰（示例数据），它将显示英格兰的俱乐部。 MU，阿森纳，曼彻斯特城。

当我点击MU和Arsenal时，将记住该复选框。但当我点击另一个国家示例西班牙和我点击皇马，巴塞罗那之前的复选框（在英格兰队）没有检查。

任何人都可以提供帮助吗？

记得jQuery Ajax Checkbox

0 个答案: