Javascript 如何在html表中显示php响应的数据_Javascript_Php_Jquery_Html_Css

Javascript 如何在html表中显示php响应的数据

javascript php jquery html css

Javascript 如何在html表中显示php响应的数据,javascript,php,jquery,html,css,Javascript,Php,Jquery,Html,Css,我试图从另一台服务器获取.json文件，并希望在html表中显示.json文件。php代码正在成功返回json。但我的问题是，我想在一个表中查看它，因为当我单击名为“获取数据”的按钮时，我无法在javascript中实现php结果这是我的.php文件 <html> <header> <title>Hello </title> </header> <body> <!--javascript

我试图从另一台服务器获取.json文件，并希望在html表中显示.json文件。php代码正在成功返回json。但我的问题是，我想在一个表中查看它，因为当我单击名为“获取数据”的按钮时，我无法在javascript中实现php结果

这是我的.php文件

<html>
<header>
    <title>Hello
    </title>
    </header>
<body>


<!--javascript make append table data-->

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script>

<script>

    $(function() {



   $.getJSON('$result.json', function(data) {
       $.each(data.videoLectureListing, function(i, f) {
          var tblRow = "<tr>" + "<td>" + f.Id + "</td>" +
           "<td>" + f.videoName + "</td>" + "<td>" + f.date + "</td>" + "<td>" + f.time + "</td>" + "<td>" + f.video + "</td>" + "<td>" + f.image + "</td>" +
           "<td>" + f.videoDuration + "</td>" + "<td>" + f.liveStatus + "</td>" + "<td>"+ "</tr>"
           $(tblRow).appendTo("#userdata tbody");
     });

   });

});
</script>




<!--javascript  append table data ended -->


<!-- user form -->
<form method='POST'>
    <input type='hidden' name='formSubmitted' value=1>

    <label for="userId"><b>UserId</b></label>
    <input type="number" placeholder="Enter Your User Id" name="userId" autofocus required>

    <label for="categoryId"><b>categoryId</b></label>
    <input type="number" placeholder="Enter categoryId" name="categoryId" required>

    <button type="submit" >GET DATA</button>
</form>
<!-- user form -->



<!--table-->

<div class="wrapper">
<div class="profile">
   <table id= "userdata" width="100%" border="5">
  <thead>
            <th>VIDEO NAME</th>
            <th>DATE</th>
            <th>TIME</th>
            <th>DURACTION</th>
            <th>LINK </th>
        </thead>
      <tbody>

       </tbody>
   </table>

</div>
</div>

<!--table data end-->



<!---php file start-->
<?php

$userId = $_POST['userId'];
$categoryId = $_POST['categoryId'];

if (isset($_POST['formSubmitted'])) {

$url = 'https://www.otherserver.php';
$data = array('userId' => $userId, 'categoryId' => $categoryId);

// use key 'http' even if you send the request to https://...
$options = array(
    'http' => array(
        'header'  => "Content-type: application/x-www-form-urlencoded\r\n",
        'method'  => 'POST',
        'content' => http_build_query($data)
    )
);
$context  = stream_context_create($options);
$result = file_get_contents($url, false, $context);
if ($result === FALSE) { /* Handle error */ }

echo ($result);
//json_encode($result, true);
}
?>


<!---php file ended    


</body>
</html>


你好
$（函数（）{
$.getJSON（'$result.json'，函数（数据）{
$。每个（数据、列表、函数（i、f）{
变量tblRow=“”+”+f.Id+“”+
“+f.videoName+++f.date+++f.time+++f.videoName+++f.image++”+
“+f.videoDuration+++f.liveStatus++”
$（tblRow）.appendTo（“#userdata tbody”）；
});
});
});
用户ID
类别
获取数据
视频名称
日期
时间
持续时间
链接
请在表单标签中添加操作属性
<!-- user form -->
    <form method='POST' action='php_file_path'>
        <input type='hidden' name='formSubmitted' value=1>

        <label for="userId"><b>UserId</b></label>
        <input type="number" placeholder="Enter Your User Id" name="userId" autofocus required>

        <label for="categoryId"><b>categoryId</b></label>
        <input type="number" placeholder="Enter categoryId" name="categoryId" required>

        <button type="submit" >GET DATA</button>
    </form>
    <!-- user form -->


用户ID
类别
获取数据
根本不清楚这里的具体问题是什么，问题是当我点击按钮时，它显示了一个json数据，但我想把它附加到表中。但我知道如何做PHP代码工作正常，返回json原始数据，但我想装饰它。请查看javascript。你真的需要先自己做基础研究。同时使用表单和ajax是非常常见的，您可以找到很多关于这个主题的教程。如果表单应发回同一URL，则不需要执行See操作