从数据库打印

时间：2017-11-01 18:54:04

标签： mysql

我试图制作一个可以打印标签的系统。但不知道如何按我想要的方式制作它。当我在数据库中只有一行时它正在工作，但是当我获得更多行时，就是我遇到布局的一些问题。 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Din Matmerking</title>

    <!-- style -->
    <link href="config/stil/style.css" rel="stylesheet" type="text/css">
    <link href="config/stil/oppskrift.css" rel="stylesheet" type="text/css">
    <link href="config/stil/merk.css" rel="stylesheet" type="text/css">
    <!-- <link href="/config/stil/base_style.css" rel="stylesheet" type="text/css"> -->

    <!-- W3 -->
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">


    <!-- Bootstrap -->
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>

<body>
    <div id="main" class="container">
        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="logo"><img src="/img/Logo2.png" class="img-responsive"></div>
            </div>
            <br>
            <nav class="navbar navbar-default">
                <div class="container-fluid">
                    <div class="navbar-header">
                        <a class="navbar-brand" href="#">Velkommen</a>
                    </div>
                    <ul class="nav navbar-nav">
                        <li><a href="/login/welcome.php">Hjem</a></li>
                        <li><a href="/bin/appdata/oppskrift-bok.asp">Oppskrifter</a></li>
                        <li><a href="../appdata/merkelapper.php">Matmerking</a></li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="/index.php"><span class="glyphicon glyphicon-log-out"></span> Logg ut</a></li>
                    </ul>
                </div>
            </nav>
            <div class="panel-body">
                <div class="well">
                    <div id="printableArea">
                        <form id="merk">
                            <table>
                                <thead>
                                    <!-- <tr>
                                    <th id="text">Matmerking</th>
                                </tr>
                                <tr>
                                    <th><br></th>
                                </tr> -->
                                </thead>
                                <tbody>
                                    <?php
                                    while($row = mysqli_fetch_array($result))
                                        {
                                            echo '
                                            <tr>
                                            <td id="text"><b>Produkt:&ensp;</b></td>
                                            <td><b>'.$row["name"].'</b></td>
                                            </tr>
                                            <tr>
                                            <td id="text"><b>Laget:&ensp;</b></td>
                                            <td><b>'.$row["produsert"].'</b></td>
                                            </tr>
                                            <tr>
                                            <td id="text"><b>Holdbarhet:&ensp;</b></td>
                                            <td><b>'.$row["holdbarhet"].'</b></td>
                                            </tr>
                                            <tr>
                                            <td id="text"><b>Pris pr kg:&ensp;</b></td>
                                            <td><b>'.$row["pris_kg"].'&ensp;,-</b></td>
                                            </tr>
                                            <tr>
                                            <td id="text"><b>Laget av:&ensp;</b></td>
                                            <td><b>'.$row["signatur"].'</b></td>
                                            </tr>
                                            ';
                                        }
                                ?>
                                </tbody>
                            </table>
                        </form>
                    </div>
                    <br>
                    <input type="button" class="btn btn-primary" onclick="printDiv('printableArea')" value="Print" />
                </div>
            </div>
            <div class="panel-footer">
                <br>
                <label><p>&copy; DIN-MATMERKING.NO 2017</p></label>
                <br>
            </div>
        </div>
    </div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
    <script>
        function printDiv(divName) {
            var printContents = document.getElementById(divName).innerHTML;
            var originalContents = document.body.innerHTML;
            document.body.innerHTML = printContents;
            window.print();
            document.body.innerHTML = originalContents;
 }
    </script>
</body>
</html>

我希望用户能够选择在MySqlDB的表格数据中显示的名称。

这就是我希望它显示的方式：

在这里，您可以看到我在数据库中有更多行时的外观：

任何adwise？也许可以在html中显示一个数据库表，并将其命名为链接并打开一个模块，其中显示我要打印的信息。 

<?php
$connect = mysqli_connect("connection", 
"username", "password", "DB");
$query = "SELECT * FROM merkelapp";
$result = mysqli_query($connect, $query);
?>

DB structure

1 个答案:

答案 0 :(得分：0)

因此，对于每个标签，HTML的基本结构应如下所示：

<div id="printableArea"> <!-- HERE YOU MUST HAVE A UNIQUE ID FOR EACH LABEL -->
    <form id="merk"> <!-- HERE YOU MUST HAVE A UNIQUE ID FOR EACH LABEL AS WELL -->
        <table><!-- LABEL DETAILS --></table>

        <!-- HERE YOU NEED TO PASS THE UNIQUE ID OF THE AREA YOU WANT TO PRINT -->
        <input type="button" class="btn btn-primary" onclick="printDiv('printableArea')" value="Print" /> 
    </form>
</div>

我的建议是，您为每个标签创建单独的.well包装，并使用 merkelapp 表中每行的唯一id，您可以创建一个元素的唯一ID属性：

<?php while($row = mysqli_fetch_array($result)) { ?>
<div class="well">
    <div id="printableArea<?php echo $row['id']; ?>">
        <form id="merk<?php echo $row['id']; ?>">
            <table>
            <tbody>
                <tr>
                    <td id="text"><b>Produkt:&ensp;</b></td>
                    <td><b><?php echo $row["name"]; ?></b></td>
                </tr>
                <tr>
                    <td id="text"><b>Laget:&ensp;</b></td>
                    <td><b><?php echo $row["produsert"]; ?></b></td>
                </tr>
                <tr>
                    <td id="text"><b>Holdbarhet:&ensp;</b></td>
                    <td><b><?php echo $row["holdbarhet"]; ?></b></td>
                </tr>
                <tr>
                    <td id="text"><b>Pris pr kg:&ensp;</b></td>
                    <td><b><?php echo $row["pris_kg"]; ?>&ensp;,-</b></td>
                </tr>
                <tr>
                    <td id="text"><b>Laget av:&ensp;</b></td>
                    <td><b><?php echo $row["signatur"]; ?></b></td>
                </tr>
            </tbody>
            </table>
        </form>
    </div>
    <br>
    <input type="button" class="btn btn-primary" onclick="printDiv('printableArea<?php echo $row['id']; ?>')" value="Print" />
</div>
<?php } ?>

请注意，我在id属性（printableArea<?php echo $row['id']; ?>）后添加了每行的ID，因此ID的输出将为printableArea1，printableArea2，{{1 }} 等等。我对每个表单都做了同样的事情（printableArea3，merk1 ...）。

我还更改了merk2并添加了行ID，因此当您点击按钮时，它会将正确的ID传递给该功能。

作为旁注，我建议使用htmlentities来转义输出，因此像printDiv('printableArea')这样的字符不会通过将其替换为相应的>来破坏HTML结构，所以不要只是具有：

&gt;

你这样输出：

<td><b><?php echo $row["name"]; ?></b></td>
相关问题
最新问题