两个表的主细节

时间:2016-04-20 15:27:23

标签: javascript php mysql

我想在php和javascript中用两个表创建一个master - detail的详细信息:

第一个表是从数据库加载的,它包含一些类别。 当我点击第一个表格中的一行时,我想在第二个表格中查看所选类别的所有子类别。

我试过这个但是我无法为子类别表创建查询。

<div class="uk-grid">
<!-- First Table - List of Categories -->
<div class="uk-width-1-2" id="Gruppi" > 
    <div class="uk-panel uk-panel-box">
        <h2>Gruppi</h2>
        <?php
        // Connessione al db
        $con = mysqli_connect('localhost','root','','conti');
        if (!$con) {
            die('Could not connect: ' . mysqli_error($con));
        }

        mysqli_select_db($con,"ajax_demo");
        $sql="SELECT Gruppo, Tipo FROM gruppi";
        $result = mysqli_query($con,$sql);

        echo "<section class=\"wrapper style5\">
        <table id=\"table_gruppi\" class=\"uk-table uk-table-hover uk-table-striped uk-table-condensed\" > <thead> <tr>
        <th>Gruppo</th>
        <th>Entrata</th>
        </tr>
        </thead>
        <tbody>";

        while($row = mysqli_fetch_array($result)) {
            echo "<tr>";
            echo "<td>" . $row['Gruppo'] . "</td>";
            // Checkbox al posto di 1 o 0
            if ($row["Tipo"]=='1') {
                echo "<td> <input checked=\"\" type=\"checkbox\" disabled> </input> </td>";
            } elseif ($row["Tipo"]=='0') {
                echo "<td> <input type=\"checkbox\" disabled> </input> </td>";
            }
            echo "</tr>";
        }
        echo "</table></section>";
        mysqli_close($con);
        ?>
    </div>
</div>

<!-- Second Table - List of Subcategories -->
<div class="uk-width-1-2"><div class="uk-panel uk-panel-box"><h2>Sottogruppi</h2>
<p id="click-response"></p>
<?php
        // Connessione al db
        $con = mysqli_connect('localhost','root','','conti');
        if (!$con) {
            die('Could not connect: ' . mysqli_error($con));
        }

        mysqli_select_db($con,"ajax_demo");
        $sql="SELECT Sottogruppo FROM sottogruppi WHERE Gruppo = ";
        $result = mysqli_query($con,$sql);

        echo "<section class=\"wrapper style5\">
        <table id=\"table_gruppi\" class=\"uk-table uk-table-hover uk-table-striped uk-table-condensed\" > <thead> <tr>
        <th>Sottogruppo</th>
        </tr>
        </thead>
        <tbody>";

        while($row = mysqli_fetch_array($result)) {
            echo "<tr>";
            echo "<td>" . $row['Sottogruppo'] . "</td>";
            echo "</tr>";
        }
        echo "</table></section>";
        mysqli_close($con);
        ?>

</div></div>

    <script type="text/javascript">
        function onRowClick(tableId, callback) {
            var table = document.getElementById(tableId),
                rows = table.getElementsByTagName("tr"),
                i;
            for (i = 0; i < rows.length; i++) {
                table.rows[i].onclick = function (row) {
                    return function () {
                        callback(row);
                    };
                }(table.rows[i]);
            }
        };

        onRowClick("table_gruppi", function (row){
            var value = row.getElementsByTagName("td")[0].innerHTML;
            document.getElementById('click-response').innerHTML = value + " clicked!";
            console.log("value>>", value);
            var sql_sottogruppi = "SELECT Sottogruppo FROM sottogruppi WHERE Gruppo = '" + value + "'"
        });
    </script>

我需要一些帮助或示例。 非常感谢你!

0 个答案:

没有答案