如何将具有相同名称的动态创建的文本框插入数据库?

时间:2018-10-31 23:58:12

标签: php html mysql arrays database

这是我的html代码。它会动态创建这些文本框,但它们都具有相同的名称。

  <?php
include 'db.php';
$office = $_GET['office'];
$application_name = $_GET['application_name'];
?>
<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Add Requirements for New Application</title>

    <!-- Bootstrap core CSS -->
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="css/sidebar.css" rel="stylesheet">
    <script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script>

    <script src="js/jquery.min.js"></script> 
           <link href="css/bootstrap.min.css" rel="stylesheet"> 
           <script src="js/bootstrap.min.js"></script>


    <!-- Bootstrap css library -->

</head>

<style>



.header--banner {
    background-image: url(cb.jpg);
    background-size:100% 100%;
    background-repeat: no-repeat;

}
.header--banner {

height: 45.5rem;

}

.jumbotron{
    padding: 0.5em 0.6em;
}

.header--banner {
    background-image: url(magic.jpg);
    background-size:100% 100%;
    background-repeat: no-repeat;

}
.header--banner {

height: 45.5rem;

}

.jumbotron{
    padding: 0.5em 0.6em;
     position: relative;
    text-align: center;
    color: black;
}
.green{
    text-decoration: none;
    font-family: Modern;
    font-size: 18px;
    border-radius: 5px;
    padding: 5px 8px;
    background-color:  #27ae60;
    color: #ffffff;
  }
  a.green:hover{
    text-decoration: none;
    background-color:  #145a32;
    color: #ffffff;
    transition: 0.7s;
  }

  .bs-example2{
  border: 3px solid black;
  background: #f5f5f5;
  text-align: center;
  padding:20px;
  margin:5px;
  height:200px;
  }






</style>

<body>
    <header class="header--banner">

    <div id="wrapper">

        <!-- Sidebar -->
        <div id="sidebar-wrapper">
             <ul class="sidebar-nav">
                <li class="sidebar-brand">
                    <a href="kiosk-HOMEPAGE.php">
                        HOME
                    </a>
                </li>
                <li>
                    <a href="kiosk-OFFICES.php">Offices</a>
                </li>
                <li>
                    <a href="kiosk-EMPLOYEES.php">Employees</a>
                </li>

                <li>
                    <a href="kiosk-EDIT_ADMIN.php"> Change Username & Password</a>
                </li>
                <li>
                    <a href="kiosk-REPORTS.php">Reports</a>
                </li>
                <li>
                    <a href="kiosk-login.php">Log Out</a>
                </li>

            </ul>
        </div>
        <!-- /#sidebar-wrapper -->

        <!-- Page Content -->

        <div id="page-content-wrapper">
            <div class="jumbotron">
            <div class="container-fluid">
                 <img src="urdBanner.jpg" id="urdBanner" alt="Banner" style="width:100%; height:250px;"> 
                <center><h2 style="position:relative;">Requirements</h2></center>
                <p></p>


                 <a href="#menu-toggle" id="menu-toggle"><img src="menu.jpg" class="rounded-circle" style="width:30px; height:30px;"></a>
                 <br>
                 <br>
                 <a href="kiosk-charter.php" class="btn btn-default">Previous</a>


        <br>
        <br>

           <form method="get" action="kiosk-NEW_CHARTER_REQUIREMENTS_insert.php">

<input type="hidden" name="office" value="<?php echo $office ?>">
<input type="hidden" name="application_name" value="<?php echo $application_name ?>">



                <br>

                <div class="row form-group">
                     <div class="col-md-2"><label for="textBox" class="col-form-label"><b>Step By Step Procedure</b></label>
                    </div>
                    <div class="col-md-2"><label for="textBox" class="col-form-label"><b>Personnel in charge</b></label>
                    </div>
                    <div class="col-md-2"><label for="textBox" class="col-form-label"><b>Time needed to complete procedure</b></label>
                    </div>
                    <div class="col-md-2"><label for="textBox" class="col-form-label"><b>Amount of fees if any</b></label>
                    </div>
                    <div class="col-md-2"><label for="textBox" class="col-form-label"><b>Required Documents</b></label>
                    </div>
                    <div class="col-md-2"><label for="textBox" class="col-form-label"><b>Procedure for the filing of complaints</b></label>
                    </div>

            </div>
                </div>

    <div class="form-group fieldGroup">
        <div class="input-group">
            <div class="col-md-2">
                <textarea name="steps[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Steps"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="personnel[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Personnel"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="time[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Time"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="fees[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Fees"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="documents[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Documents"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="complaints[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Complaints"></textarea>
            </div>

            <div class="input-group-addon"> 
                <a href="javascript:void(0)" id="add" class="btn btn-success addMore"><span class="glyphicon glyphicon glyphicon-plus" aria-hidden="true"></span> Add</a>
            </div>

        </div>
    </div>




<!-- copy of input fields group -->
<div class="form-group fieldGroupCopy" style="display: none;">
    <div class="input-group">
        <div class="col-md-2">
                <textarea name="steps[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Steps"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="personnel[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Personnel"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="time[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Time"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="fees[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Fees"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="documents[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Documents"></textarea>
            </div>
            <div class="col-md-2">
                <textarea name="complaints[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Complaints"></textarea>
            </div>
        <div class="input-group-addon"> 
            <a href="javascript:void(0)" class="btn btn-danger remove"><span class="glyphicon glyphicon glyphicon-remove" aria-hidden="true"></span> Remove</a>
        </div>
    </div>
</div>

            <input type="submit" name="submit" class="btn btn-primary" value="SUBMIT"/>

            </form>


    </div>
</div>
</div>
</div>
</header>

    <script type="text/javascript">
   $(document).ready(function(){
    //group add limit
    var maxGroup = 10;

    //add more fields group
    $(".addMore").click(function(){
        if($('body').find('.fieldGroup').length < maxGroup){
            var fieldHTML = '<div class="form-group fieldGroup">'+$(".fieldGroupCopy").html()+'</div>';
            $('body').find('.fieldGroup:last').after(fieldHTML);
        }else{
            alert('Maximum '+maxGroup+' groups are allowed.');
        }
    });

    //remove fields group
    $("body").on("click",".remove",function(){ 
        $(this).parents(".fieldGroup").remove();
    });
});


    </script>
    <script type="text/javascript">
// Auto-Grow-TextArea script.
// Script copyright (C) 2011 www.cryer.co.uk.
// Script is free to use provided this copyright header is included.
function AutoGrowTextArea(textField)
{
  if (textField.clientHeight < textField.scrollHeight)
  {
    textField.style.height = textField.scrollHeight + "px";
    if (textField.clientHeight < textField.scrollHeight)
    {
      textField.style.height = 
        (textField.scrollHeight * 2 - textField.clientHeight) + "px";
    }
  }
}
</script>


     <script src="vendor/jquery/jquery.min.js"></script>
    <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

    <!-- Menu Toggle Script -->
    <script>


    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled");
    });
    </script>
    </body>
    </html>

这是我的insert.php

  <?php
if(isset($_GET['submit'])){

    $con = mysqli_connect('localhost','root','','information_kiosk');
    $office = $_GET['office'];

    $application_name = $_GET['application_name'];
   $steps = $_GET['steps'];
    $personnel = $_GET['personnel'];
    $time = $_GET['time'];

    $fees = $_GET['fees'];
    $documents = $_GET['documents'];
    $complaints = $_GET['complaints'];


$totalSize = sizeof($steps);

for($i=0;$i <=$totalSize;$i++) {

    $InsertSteps = (!empty($steps[$i])) ? $steps[$i] : '';
    $InsertPersonnel = (!empty($personnel[$i])) ? $personnel[$i] : '';
    $InsertTime = (!empty($time[$i])) ? $time[$i] : '';
     $InsertFees = (!empty($fees[$i])) ? $fees[$i] : '';
    $InsertDocuments = (!empty($documents[$i])) ? $documents[$i] : '';
    $InsertComplaints = (!empty($complaints[$i])) ? $complaints[$i] : '';;

   echo $InsertSteps;
   echo "<br>";
   echo $InsertPersonnel;
    echo $InsertSteps;
   echo "<br>";


}
}
?>

*更新。现在,我的插入代码只显示第一行数据,而不显示第二或第三行

仅将第一行插入数据库,但随后的动态创建的行则不插入。我的问题是如何更改语法,以便每一行都可以插入到数据库中。

stepsColumn   PersonnelColumn   timeColumn  feesColumn   documentsColumn  
 array[0]         array[0]      array [0]    array[0]        array[0]
 array[1]         array[1]      array [1]    array[1]        array[1]

0 个答案:

没有答案
相关问题