php - 如何显示附加复选框并在ajax调用后自动选中

Question

我在 ajax 调用中显示附加复选框时遇到一些问题，这是我的 json 结果

[{"nama":"Food","idkategori":"1","dicek":"iya"},{"nama":"Fashion","idkategori":"2","dicek":"iya"},{"nama":"Beverages","idkategori":"3","dicek":"iya"},{"nama":"Art","idkategori":"4","dicek":"tidak"},{"nama":"Music","idkategori":"5","dicek":"tidak"},{"nama":"Technology","idkategori":"6","dicek":"tidak"},{"nama":"Smartphone","idkategori":"7","dicek":"tidak"},{"nama":"Computer","idkategori":"8","dicek":"tidak"},{"nama":"Games","idkategori":"9","dicek":"tidak"},{"nama":"Movies","idkategori":"10","dicek":"tidak"},{"nama":"Sports","idkategori":"11","dicek":"tidak"},{"nama":"Books","idkategori":"12","dicek":"tidak"}]

如果复选框已被选中，我的查询中将进行检查。值复选框保存到数据库，我想显示所有选中或未选中的复选框。这是我的 ajax 代码

$.ajax({
            url: host+'/skripsi3/phpmobile/appendfilter.php',
            data: { "id": user},
            dataType: 'json',
            success: function(data, status){
                $.each(data, function(i,item){ 
                    //alert("here");
                    $("#appendfilter").append('<input class="kategoriFilter" type="checkbox" value="'+item.nama+'" name="cektambah" id="'+item.idkategori+'"><label for="'+item.idkategori+'">'+item.nama+'</label>').trigger("create");
                    if(item.dicek=="iya")
                    {
                        $("#"+item.idkategori).prop('checked', true);
                    }
                    else if(item.dicek=="tidak")
                    {
                        $("#"+item.idkategori).prop('checked', false);
                    }

                });
            },
            error: function(e){
                //alert(e);
            }
        }); 

这是我的appendfilter.php

<?php
session_start();
include "config.php";
$user=mysql_real_escape_string($_GET["id"]);
$result=mysql_query("SELECT * from filtering WHERE id_tenant='$user'") or die(mysql_error());

if (!empty($result))
{
    while ($row=mysql_fetch_array($result))
    {
        $tempfilter[] = $row['filter'];
        $q="select 'iya' as dicek,kategori.id_kategori,kategori.nama from kategori WHERE id_kategori  IN (".implode(',',$tempfilter).") UNION ALL select 'tidak' as dicek,kategori.id_kategori,kategori.nama from kategori where id_kategori  NOT IN (".implode(',',$tempfilter).") ";

        //echo $q;
        $result2 = mysql_query($q) or die(mysql_error());
        if (!empty($result2))
        {
            while ($row2=mysql_fetch_array($result2))
            {
                $fetchkategori[] = array
                (
                    'nama' => $row2['nama'],
                    'idkategori' => $row2['id_kategori'],
                    'dicek' => $row2["dicek"]
                );  
            }
        }

    }
}

mysql_close($con);

header('Content-Type:application/json');
echo json_encode($fetchkategori);
?>

希望有人能帮我解决我的问题。

Answer 1

尝试检查您的 html 是否已准备好。假设您正确获取 json 对象:

$(document).ready(function(){

var data =[
{"nama":"Food","idkategori":"1","dicek":"iya"},
{"nama":"Fashion","idkategori":"2","dicek":"iya"},
{"nama":"Beverages","idkategori":"3","dicek":"iya"},
{"nama":"Art","idkategori":"4","dicek":"tidak"},
{"nama":"Music","idkategori":"5","dicek":"tidak"},
{"nama":"Technology","idkategori":"6","dicek":"tidak"},
{"nama":"Smartphone","idkategori":"7","dicek":"tidak"},
{"nama":"Computer","idkategori":"8","dicek":"tidak"},
{"nama":"Games","idkategori":"9","dicek":"tidak"},
{"nama":"Movies","idkategori":"10","dicek":"tidak"},
{"nama":"Sports","idkategori":"11","dicek":"tidak"},
{"nama":"Books","idkategori":"12","dicek":"tidak"}];


  $.each(data, function(i,item){ 
                    $("#appendfilter").append('<input class="kategoriFilter" type="checkbox" value="'+item.nama+'" name="cektambah" id="'+item.idkategori+'"><label for="'+item.idkategori+'">'+item.nama+'</label>').trigger("create");
                    if(item.dicek=="iya")
                    {
                        $("#"+item.idkategori).prop('checked', true);
                    }
                    else if(item.dicek=="tidak")
                    {
                        $("#"+item.idkategori).prop('checked', false);
                    }

                });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="appendfilter"></div>