Javascript 创建表格并显示所选字段

我填了一张表格，输入了轴的数量（黑色圆圈）。然后表单会将我发送到此页面：

在这个表格中，我输入了12个轴，它在这里显示了它们。 现在，在黑色圆圈下，您可以看到文本框。忽略这些。但在它们下面你会看到复选框。 现在我想要的是以下内容：

当我选择其中的示例2，然后按：Make Boogie。我希望它创建一个表，并显示如下内容：

现在，当我按下Make Boogie。我希望这两个选项框（或更多，取决于您选择的选项）灰显。所以我不能再选择它们了。 现在，当我按下下一个2或3个轴，并选择：makeboogie。我希望表格能够展开并显示这些信息。完成后，将选择选项灰显

我的代码（如果需要）：

列车：



抱歉，但问题是什么？你看到我在第二张图中制作的桌子了吗？？我不想让页面自动创建它。恐怕从问题上看，这并不明显。反正对我来说不是。
<div id="center">
<?php
    //Train is send here//
    $add_train = $database->train_add();
?>
    Train: <?php echo $_POST['train_name']; ?>
    <!--Here we make the number of fields based on the number of axles-->
    <div id="axle_bogie_border"><br /> <br />
    <!--The show axles are the number of checkboxes (Filled in by a user)-->
        <table>
            <div id="show_axles">
                <tr>
                    <?php
                        $_POST['number_of_axles'];
                            if(isset($_POST['number_of_axles'])){
                            for($i=0; $i<$_POST['number_of_axles']; $i++){
                                echo "<td>" . "<div id='axle_figure'>" . $i . "</div>" . "</td>";
                            }   
                        }
                    ?>
                </tr>               
            </div>


            <div id="distances">
                <tr>
                    <?php
                        $_POST['number_of_axles'];
                            if(isset($_POST['number_of_axles'])){
                            for($i=0; $i<$_POST['number_of_axles']; $i++){
                                echo "<td>" . "<input type='text' placeholder='Distance $i' id='field' name='distance[$i]'>" . "</td>";
                            }
                        }
                    ?>
                </tr>
            </div>


            <div id="checkboxes">
                <tr>
                    <?php
                        $_POST['number_of_axles'];
                            if(isset($_POST['number_of_axles'])){
                            for($i=0; $i<$_POST['number_of_axles']; $i++){
                                echo "<td>" . "<input type='checkbox' name='box[$i]'>" . "</td>";
                            }
                        }
                    ?>
                </tr>
            </div>
        </table>


            <!--De onClick function is nog een test (zie Script bij lijn 77)-->
            <button onclick="myFunction();" id="add_train_button2">Refresh</button>
            <button onclick="myFunction('testing');" id="add_train_button3">Make Boogie</button>
            <a href="index.php" id="return_to_home">Back to home screen!</a><br /><br />
            <p id="refresh_button"></p>

            <br /><br />
            <div id="button_explanation"><b>Refresh:</b> show train model after distances have been added (Axles get in place).<br />
            <b>Make Boogie:</b> after you selected the Nr. of wheels that contain 1 boogie you press the button<br />
            after you have done that, a table will show up with the Boog Nr. and the axle Nrs. of that boogie</div>
    </div>
</div>
<!--Dit script is een test-->
<script>
function myFunction() {
    document.getElementById('refresh_button').innerHTML = "Hello World";
}
</script>