简体   繁体   English

PHP回显一个表,将其附加到DOM中的特定元素?

[英]PHP echoing a table, appending it to a specific element in the DOM?

I have this code, which checks a database and returns some rows to my PHP code containing 4 values (id, playerA, playerB, turn, all INT). 我有这段代码,它检查数据库并向我的PHP代码返回一些行,其中包含4个值(id,playerA,playerB,turn,所有INT)。

I would like to use that array to build up a table and then append the table to a specific location in the DOM, but i dont know how i could do that. 我想使用该数组来建立一个表,然后将该表追加到DOM中的特定位置,但是我不知道该怎么做。

I could do it another way (get the rows via JS Ajax and then use JS to build and append the table), which i know how, but i dont want to do that. 我可以做另一种方式(通过JS Ajax获取行,然后使用JS生成并追加表),我知道如何做,但是我不想这样做。

Is it possible to create a table and append it to a div using php/html/css ? 是否可以使用php / html / css创建表并将其附加到div?

thanks 谢谢

<?php
if (isset($_SESSION["userid"])){
    $dbManager = DBManager::app();
    $manager = new Manager($_SESSION["userid"]);
    $gameList = $manager->getGames();

    if ($gameList) {
        Debug::log("got active games: ".sizeof($gameList);
    }
    else {
        Debug::log("no games");
    }   
}
else {
        Debug::log("no user id");
}

?>

<!DOCTYPE html>
<html>
<head>
    <link rel='stylesheet' href='style.css'/>
    <script src="jquery-2.1.1.min.js"></script>
    <script src='script.js'></script>
    <script src='ajax.js'></script>
</head>
    <body>
        <input type="button" value="createGame" onclick="createGame()">
        <divid="gameListDiv">
        <div><a href="logout.php">LOGOUT</a></div>
    </body>
</html>

EDIT 编辑

 <?php
    $table = "";

    if ($gameList) {
        foreach ($gameList as $game){       
            $table += "<tr>";
            $table += "<td>";
            $table += $game["name"];
            $table += "</td>";
            $table += "</tr>";
        }

        $table += "</table>";
    }
?>

    <body>
        <input type="form" id="gameName" placeholder="Enter Game Name here"></input>    
        <input type="button" value="createGame" onclick="createGame()"></input>
        <div>
            <span>Active Games</span>
            <?php echo $table; ?>       
        </div>              
        <div><a href="logout.php">LOGOUT</a></div>
    </body>

You need to understand that the DOM does not yet exist - it is created by the browser, and the browser builds it based on the output of your combined PHP & HTML. 您需要了解DOM尚不存在-它是由浏览器创建的,浏览器根据PHP和HTML组合的输出来构建它。

There are many ways to solve this problem without resorting to Ajax calls etc. 有许多方法可以解决此问题,而无需求助于Ajax调用等。

<!DOCTYPE html>
<html>
<head>
    <link rel='stylesheet' href='style.css'/>
    <script src="jquery-2.1.1.min.js"></script>
    <script src='script.js'></script>
    <script src='ajax.js'></script>
</head>
    <body>
        <input type="button" value="createGame" onclick="createGame()">
        <div id="gameListDiv">

        <?php

            if (isset($_SESSION["userid"])){
                $dbManager = DBManager::app();
                $manager = new Manager($_SESSION["userid"]);
                $gameList = $manager->getGames();

                if ($gameList) {
                    Debug::log("got active games: ".sizeof($gameList);

                    echo '<table style="width:100%">';

                    //assuming we can iterate over the $gameList value
                    foreach($gameList as &$game)
                    {
                        //here i assume that the result returned is an object with these properties - it might be the case that you need to do something like $game['playerA'] or $game->getData('playerA') - i am not sure what database lib you are using.
                        echo '<tr>
                            <td>'.$game->playerA.'</td>
                            <td>'.$game->playerB.'</td>
                            <td>'.$game->turn.'</td>
                          </tr>';
                    }

                    echo '</table>';
                }
                else {
                    Debug::log("no games");
                }   
            }
            else {
                    Debug::log("no user id");
            }

            ?>

        </div>
        <div><a href="logout.php">LOGOUT</a></div>
    </body>
</html>

In this example we are just running the PHP in-line with the HTML. 在此示例中,我们仅将HTML与HTML内联运行。

You could also do something like this if you wanted to keep all of your database logic at the top of the page and not in-line with the HTML: 如果您想将所有数据库逻辑都保留在页面顶部而不与HTML保持一致,则也可以执行以下操作:

<?php
    /* Database logic here */
    $variable = '<span>this variable could contain any old html that came from the database logic</span>';
?>

<html>
<head>

</head>
<body>
    <php echo $variable; ?>
</body>
</html>

If you want to build the list before page load, you can just insert something like this where you want the table to go: 如果要在页面加载之前构建列表,则只需在希望表插入的位置插入以下内容:

<table>
    <?php foreach($gamelist as $game){ ?>
    <tr>
        <td><?=$game.id></td>
        <td><?=$game.playerA></td>
        <td><?=$game.playerB></td>
        <td><?=$game.turn></td>
    </tr>
    <? } ?>
</table>

This will work because with PHP, the page hasn't been built and displayed to the user yet when you've got your data in $gamelist. 这将起作用,因为使用PHP,当您将数据放入$ gamelist中时,尚未构建页面并将其显示给用户。 All of your PHP code will be run before the page is actually sent to the user--which means you don't need to "update" the page later, you can just build it now. 您的所有PHP代码都将在该页面实际发送给用户之前运行-这意味着您以后无需“更新”该页面,您现在就可以构建它。

If you're looking to collect or update your data after page load (it's unclear from your comments), this is impossible with only PHP as it's a server-side language. 如果您要在页面加载后收集或更新数据(您的注释尚不清楚),则仅使用PHP是不可能的,因为它是服务器端语言。 You would need to either reload the page or use AJAX for that. 您可能需要重新加载页面或为此使用AJAX。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM