以数据表格格式显示从PHP返回的JSON数据

我是JQUERY的新手，我正在尝试搜索某些内容并基于搜索到的文本进行ajax调用，该调用将调用php函数并返回PHP我与JSON数据。我想在数据表格中显示返回的数据。我有我的PHP文件table.php和JavaScript文件jss.js和我的main.php。 PHP文件正在返回JSON数据，我可以使用alert来显示它。以数据表格格式显示从PHP返回的JSON数据

我想知道如何在数据表中显示它。

<div> 
<input type="text" name="search_query" id="search_query" placeholder="Search Client" size="50" autocomplete="off"/> 
<button id="search" name="submit">Search</button> 
</div>

我的AJAX/jss.js文件

$(document).ready(function(){ 
    $('#search').click(function(){ 
     var search_query = $('#search_query').val(); 


     if(search_query !='') 
     {  
      $.ajax({ 
       url:"table.php", 
       method:"POST", 
       data:{search_query:search_query}, 

       success: function(data) 
       { 
        alert("HEKKI "+data); 
       } 
      }); 
     } 
     else 
     { 
      alert("Please Search again"); 
     } 
    }); 
});

我table.php文件

<?php 
    $data=array(); 
    $dbc = mysqli_connect('localhost','root','','acdc') OR die('Could not connect because: '.mysqli_connect_error()); 

     if (isset($_REQUEST['search_query'])) 
     { 
      $name = $_REQUEST['search_query']; 
     } 


     if($dbc) 
     { 

      if (!empty($name)) 
      { 
       $sql = "select c.res1  res1, 
           cc.res2  res2, 
           cc.res3  res3, 
           cc.res4  res4, 
           cc.res5  res5 
         from table1 c 
         inner join table2 cc 
         on c.id = cc.id 
         where c.name like '".$name."%' 
         and cc.ENABLED = 1"; 

       $res = mysqli_query($dbc,$sql); 


       if(!(mysqli_num_rows($res)==0)) 
       { 
        while($row=mysqli_fetch_array($res)) 
        { 
         $data['RES1'] = $row['res1']; 
         $data['RES2'] = $row['res2']; 
         $data['RES3'] = $row['res3']; 
         $data['RES4'] = $row['res4']; 
         $data['RES5'] = $row['res5']; 
        } 
       } 

       else 

       { 
        echo "<div style='display: block; color:red; text-align:center'><br/> Not Found,Please try again!!!</div>"; 
       } 
      } 
     } 
     echo json_encode($data); 

     /* 

    */ 

    ?>

能否请您指导我如何结果显示在主网页。

来源

2017-08-16 Rajesh Krishna

哟可以包括'JSON'结构或样品的返回？在我看来，你的'PHP'只返回一个单独的对象'{RES1：'res1'，RES2：'res2，等等......'} – Steve

@Steve是的你是对的。 JSON正在返回单个数据。你能帮助我如何获取所有数据 –

设置为UTF-8字符集可能是一个好主意。如果你在你的表有不同的字符集，你会得到一个JSON错误：

mysqli_set_charset($dbc, 'utf8');

然后用mysqli_fetch_assoc代替mysqli_fetch_array。你想field: value记录变成JSON：在

<table id="example"></table>

$('#example').DataTable({ 
    ajax: { 
    url: 'table.php' 
    }, 
    columns: [ 
    { data: 'res1', title: 'res1'}, 
    { data: 'res2', title: 'res2'}, 
    //etc.. 
    ] 
})

来源

2017-08-16 16:25:30 davidkonrad

一个方法是创建只是table.php文件，并支持jQuery的，你需要填充<form id="form_id">与阿贾克斯的结果与数据如愿以偿形式$('#form_id').html(ajax_response);

其他形式给出：使用jQuery JSON数据来填充每个字段分别。

var jsonData = JSON.parse(ajax_response); // decode json

比

$('#id_input_1').val(jsonData.RES1); 
$('#id_input_2').val(jsonData.RES2); 
$('#id_input_3').val(jsonData.RES3);

来源

2017-08-16 14:33:48

放置一个placeholder：

$data = array(); 
while($row=mysqli_fetch_assoc($res)) { 
    $data[] = $row; 
}

输出JSON：

echo json_encode(array('data' => $data));

现在你可以直接使用它连同数据表这种情况下，我使用#results，并动态创建一个表并将其附加到placeholder。我为这个例子评论了你的ajax，但只是调用我创建的function来处理success回调中的结果，并将新的function传递给一个JavaScript对象。

$(document).ready(function() { 
 
    $('#search').click(function() { 
 
    var search_query = $('#search_query').val(); 
 

 

 
    if (search_query != '') { 
 
     //$.ajax({ 
 
     // url: "table.php", 
 
     // method: "POST", 
 
     // data: { 
 
     // search_query: search_query 
 
     // }, 
 

 
     // success: function(data) { 
 
     // alert("HEKKI " + data); 
 
     // } 
 
     //}); 
 
     processResults({RES1: "result1", RES2: "result2"}); 
 
    } else { 
 
     alert("Please Search again"); 
 
    } 
 
    }); 
 
}); 
 
function processResults(obj){ 
 
    var $tbl = $("<table>"); 
 
    var $row = $("<tr>"); 
 
    var trow; 
 
    $.each(obj, function(idx, elem){ 
 
    trow = $row.clone(); 
 
    trow.append($("<td>" + obj[idx] + "</td>")); 
 
    $tbl.append(trow); 
 
    }); 
 
    $("#results").append($tbl); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <input type="text" name="search_query" id="search_query" placeholder="Search Client" size="50" autocomplete="off" /> 
 
    <button id="search" name="submit">Search</button> 
 
    <div id='results'></div> 
 
</div>

来源

2017-08-16 16:32:13 Steve

以数据表格格式显示从PHP返回的JSON数据

回答

相关问题