Question

我正在尝试创建一个窗口，该窗口将成为一个小的弹出窗口，其中包含来自数据库的项目列表。每个项目都是一个复选框。我的问题是列表溢出div我想要它而不是将列移过来，以便有一些列，如果有大量的记录检索（将有）。我不确定如何使用php / mysql检索确切地做到这一点 - 我知道我可能必须为每一件物品都有一个新的nieghboring div - 有没有人知道这样做的好方法？这是页面来源：

的functions.php：

// returns an array of all active users
function getActiveUsers() {
    $con = mysql_connect("-","-","-");
    if (!$con)
      {
      die('Could not connect: ' . mysql_error());
      }
    else {
        // connected to database successfully
    }
    mysql_select_db("casemanagers", $con);
    $result = mysql_query('select * from users where active=1 order by Name ASC');
    while($row= mysql_fetch_assoc($result)){
        $arr[] = $row['Name'];
    }
    return $arr;
    mysql_close($con);
}

HTML：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="English (American)" lang="English (American)">
<head>
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <style type="text/css">
        #userMenu {
            border-style:solid;
            border-size:1px;
            width:300px;
            height:300px;
            padding:20px;
            overflow:auto;
        }
    </style>

</head>

<body>
    <div id="userMenu" style="">
        <?php
            include_once('functions.php');
            $list = getActiveUsers();
            foreach ($list as $x){
                echo '<input type="checkbox" value="'.$x.'" />'.$x.'<br/>';
            }
        ?>
    </div>
</body>

</html>

Answer 1

尝试将你的div向左浮动，这样它就会从左到右列出它们而不只是列。

 <div id="userMenu" style="">
        <?php
            include_once('functions.php');
            $list = getActiveUsers();
            foreach ($list as $x){
                echo '<div class="item">';
                echo '<input type="checkbox" value="'.$x.'" />'.$x.'<br/>';
                echo '</div>';
            }
        ?>
    </div>

<强> CSS

#userMenu div.item{
float:left; margin:10px;
}

Answer 2

将您的复选框放入列表中并浮动列表项

<div id="userMenu" style="">
<ul>
    <?php
        include_once('functions.php');
        $list = getActiveUsers();
        foreach ($list as $x){
            echo '<li><input type="checkbox" value="'.$x.'" />'.$x.'</li>';
        }
    ?>
</ul>
</div>

CSS

#userMenu li { width: 33%; float:left } // will produce 3 rows;

寻找一种方法来将列出的数据库结果包装成div

2 个答案: