如何在php的html div中显示jQuery json数据

时间:2018-12-25 11:27:20

标签: php jquery json ajax

json data

Here see my result

我正在用PHP创建一个管理面板仪表板,我想在仪表板中显示动态数据,并且必须基于下拉列表显示数据,我获得了Ajax成功的数据,但是如何在html中显示该数据

<div class="col-lg-3">
    <form method="POST" class="appointment-form" id="appointment-form" enctype="multipart/form-data">
        <select onchange='fetch_val(this.value)' name="meeting" id="meeting">
            <option>--Select Meeting--</option>
                <?php
                $sql="SELECT * FROM meeting";
                $res=$conn->query($sql);
                while ($re=$res->fetch_object()) 
                {
                    ?>  
                    <option value="<?php echo $re->meeting_no; ?>"><?php echo $re->meeting_no; ?></option>
                    <?php
                }
                ?>
        </select>
    </form>
    <div class="bage">
        <h6 class="name">Register User</h6>
        <div class="d-flex align-items-center justify-content-around">
            <p class="m-0 name-valu">HERE I WANT TO DISPLAY THAT DATA</p>
        </div>
    </div>
</div>

我的脚本在这里:

<script type="text/javascript">
function fetch_val(val){                
    $.ajax({
        url:"load.php",
        type:"POST",
        data:{"meeting":val},
        dataType:"JSON",
        success:function(data){
            $('#reference_given').val((data[0].reference_given));
            $('#reference_taken').val((data[0].reference_taken));
        }
    });
}
</script>

1 个答案:

答案 0 :(得分:0)

使用ajax响应通过$ .each()显示它,并传递具有id或class的div。在成功功能中使用此

    $.each(data, function(i, item) {

$text+= '<div>'+ data[i].reference_given +'</div><br>';  });​                   
          if(text != ""){
  $("#display").append(text);   } 

希望获得帮助