为什么我的模态中的保存按钮不起作用？

Question

osHome.php

这是代码的一部分，“保存更改”按钮没有任何作用。我想将数据保存到数据库中，而我的代码似乎什么也没做。请任何人帮助我:(

//php code clip
<?php

session_start();
//Check whether the session variable User_name is present or not
if(!isset($_SESSION['User_name']) || (trim($_SESSION['User_name']) == '')) {
header("location: login.php");
exit();
}
include_once('../config.php');

if(isset($_POST['addNewOs'])){

$new_name = $_POST['newOs_name'];
$new_edition = $_POST['newOs_edition'];
$new_version = $_POST['newOs_version'];

$conn = mysqli_connect($servername, $username, $password, $dbname);

if (!$conn) {
    die("Connection failed: " . mysqli_connect_error());
}else {

$sql = "INSERT INTO oslist (oslist_name, oslist_edition, oslist_version) 
        VALUES ('$new_name', '$new_edition','$new_version')";
mysqli_query($conn, $sql);
echo "<script type='text/javascript'>alert('New record created successfully');</script>";
}

}
?>

//modal
<div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                                <h4 class="modal-title" id="myModalLabel">Add New OS</h4>
                                </div>
                                <div class="modal-body">
                                    <form method="post" action="osHome.php">
                                    <table style="width: 100%" class="table table-bordered" >
                                        <tr><th><label>OS Name</label></th>
                                            <td colspan="3" ><input type="text" name="newOs_name" class="form-control"></td>
                                        </tr>
                                        <tr><th><label>Edition</label></th>
                                            <td colspan="3" ><input type="text" name="newOs_edition" class="form-control"></td>
                                        </tr>
                                        <tr><th><label>Version</label></th>
                                            <td colspan="3" ><input type="text" name="newOs_version" class="form-control" ></td>
                                        </tr>                                       
                                    </table>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button class="btn btn-danger" data-dismiss="modal">Cancel</button>
                                    <input type="submit" name="addNewOs" value="Save Changes" class="btn btn-primary">
                            </div>
                        </div>
                      </div>
                    </div>

            <div id="selectOS"><b>Operating System info will be listed here.</b></div>

模态和按钮都包括在内，可能有一些我没有注意到的错误.. -_-

//button
<a href="#" class="btn btn-xs btn-primary" style="width:100px" data-toggle="modal" data-target="#basicModal">Add New OS</a>

Answer 1

您的按钮位于</form> 标记之外，并且与表单无关。扩展表单中的内容或在为表单提供 id 后使用 <button form="formid" > 属性。

Buttons

选项 1

<div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                <h4 class="modal-title" id="myModalLabel">Add New OS</h4>
            </div>
            <form method="post" action="osHome.php"><!-- start form here-->
                <div class="modal-body">
                    <table style="width: 100%" class="table table-bordered" >
                        <tr><th><label>OS Name</label></th>
                            <td colspan="3" ><input type="text" name="newOs_name" class="form-control"></td>
                        </tr>
                        <tr><th><label>Edition</label></th>
                            <td colspan="3" ><input type="text" name="newOs_edition" class="form-control"></td>
                        </tr>
                        <tr><th><label>Version</label></th>
                            <td colspan="3" ><input type="text" name="newOs_version" class="form-control" ></td>
                        </tr>                                       
                    </table>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-danger" data-dismiss="modal">Cancel</button>
                    <input type="submit" name="addNewOs" value="Save Changes" class="btn btn-primary">
                </div>
            </form><!-- end form here-->
        </div>
    </div>
</div>

选项 2

<div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                <h4 class="modal-title" id="myModalLabel">Add New OS</h4>
            </div>
            <div class="modal-body">
                <form method="post" action="osHome.php" id="myForm"><!-- id = myForm -->
                    <table style="width: 100%" class="table table-bordered" >
                        <tr><th><label>OS Name</label></th>
                            <td colspan="3" ><input type="text" name="newOs_name" class="form-control"></td>
                        </tr>
                        <tr><th><label>Edition</label></th>
                            <td colspan="3" ><input type="text" name="newOs_edition" class="form-control"></td>
                        </tr>
                        <tr><th><label>Version</label></th>
                            <td colspan="3" ><input type="text" name="newOs_version" class="form-control" ></td>
                        </tr>                                       
                    </table>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-danger" data-dismiss="modal">Cancel</button>
                <input type="submit" name="addNewOs" value="Save Changes" class="btn btn-primary" form="myForm"> <!-- button associated with myform-->
            </div>
        </div>
    </div>
</div>