如何使用PHP从动态输入字段捕获数组值?

时间:2015-06-30 18:32:16

标签: javascript php html arrays database

我正在编写一个在线时间跟踪网页,允许用户将他们的学习时间输入到该系统中。用户将首先键入名称,然后根据当天输入学习时间。在一天内可以有多个学习时间。

以下是我对第一页的编码,

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
	<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
	<link href="style.css" rel="stylesheet">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

      <script>
         function addRow(tableID) {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;
            if(rowCount < 5){                            
                var row = table.insertRow(rowCount);
                var colCount = table.rows[0].cells.length;
                for(var i=0; i<colCount; i++) {
                    var newcell = row.insertCell(i);
                    newcell.innerHTML = table.rows[0].cells[i].innerHTML;
                };
            }else{
                 alert("Maximum Schedule per day is 5");
                       
            };
        };
		
    </script>
</head>
    <body>
    
    	
        <div class="bodycontainer">
        	<h1>
				<?php
					echo date("l,F  d") ;
				?>
        	</h1>
    		<div class="panel panel-default">
      			<div class="panel-heading">Schedule Activity</div>
     		 <div class="panel-body">
             
        		<form name="Enter Study Schedule"  class="form-horizontal" method="post" action="handleSchedule.php">
    			  <div class="form-group">
                    <label for="name" class="col-sm-3 control-label">Name:</label>
                    <div class="col-sm-6">
                      <input type="text" name="name" class="form-control" >
                    </div>
                  </div>
        
  					</div>
                    
  					
                   <div class="form-group">
                      <div class="col-sm-7">
                      <table id="dataTable1" class="form-control">
                      	<label for="Monday">Monday</label>
  						<input type="button" value="Add Schedule" onClick="addRow('dataTable1')" /> 
                          <tbody>
                          <tr>
                              <p>
                          <td>
                              <label>Start Time</label>
                              <input type="text" class="form-control" name="startTime[]">
                          </td>
                          <td>
                              <label>End Time</label>
                              <input type="text" class="form-control" name="endTime[]">
                          </td>
                          </tr>
                          </tbody>
                      </table>
                      </div>
                    </div> 
                    
                    <div class="form-group">
                      <div class="col-sm-7">
                      <table id="dataTable1" class="form-control">
                      	<label for="Tuesday">Tuesday</label>
  						<input type="button" value="Add Schedule" onClick="addRow('dataTable1')" /> 
                          <tbody>
                          <tr>
                              <p>
                          <td>
                              <label>Start Time</label>
                              <input type="text" class="form-control" name="startTime[]">
                          </td>
                          <td>
                              <label>End Time</label>
                              <input type="text" class="form-control" name="endTime[]">
                          </td>
                          </tr>
                          </tbody>
                      </table>
                      </div>
                    </div> 
                    
                    <div class="form-group">
                      <div class="col-sm-7">
                      <table id="dataTable2" class="form-control">
                      	<label for="Wednesday">Wednesday</label>
  						<input type="button" value="Add Schedule" onClick="addRow('dataTable2')" /> 
                          <tbody>
                          <tr>
                              <p>
                          <td>
                              <label>Start Time</label>
                              <input type="text" class="form-control" name="startTime[]">
                          </td>
                          <td>
                              <label>End Time</label>
                              <input type="text" class="form-control" name="endTime[]">
                          </td>
                          </tr>
                          </tbody>
                      </table>
                      </div>
                    </div>
                    
                    <div class="form-group">
                      <div class="col-sm-7">
                      <table id="dataTable3" class="form-control">
                      	<label for="Thursday">Thursday</label>
  						<input type="button" value="Add Schedule" onClick="addRow('dataTable3')" /> 
                          <tbody>
                          <tr>
                              <p>
                          <td>
                              <label>Start Time</label>
                              <input type="text" class="form-control" name="startTime[]">
                          </td>
                          <td>
                              <label>End Time</label>
                              <input type="text" class="form-control" name="endTime[]">
                          </td>
                          </tr>
                          </tbody>
                      </table>
                      </div>
                    </div>
                    
                    <div class="form-group">
                      <div class="col-sm-7">
                      <table id="dataTable4" class="form-control">
                      	<label for="Friday">Friday</label>
  						<input type="button" value="Add Schedule" onClick="addRow('dataTable4')" /> 
                          <tbody>
                          <tr>
                              <p>
                          <td>
                              <label>Start Time</label>
                              <input type="text" class="form-control" name="startTime[]">
                          </td>
                          <td>
                              <label>End Time</label>
                              <input type="text" class="form-control" name="endTime[]">
                          </td>
                          </tr>
                          </tbody>
						</table>
                        
                     <div class="form-group">
                       		 <input type="submit"  value="Submit" class="btn btn-primary"></input>
                        </div>          
                        
                      </form>
                      </div>
                    </div>                    
                           
                   
 

    </body>
</html>

我部分完成了handleSchedule.php页面,

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Singhealth</title>
	<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
	<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
	<link href="style.css" rel="stylesheet">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

</head>
    <body>
    	
        <?php
            function getDbConnect() {
            $con = mysqli_connect("localhost:3306", "Stud", "Stud", "Student");
            return $con;
        }
		
        $con = getDbConnect();

        $name = $_POST['name'];

        ?>
        <div class="space">
            <div class="container">
                <div class="row">

                    <?php
				  
					  if (mysqli_connect_errno($con)) {
						  echo "Failed to connect to MySQL: " . mysqli_connect_error();
					  } else {
						  $sql = "INSERT INTO timetableschedule (name) ". 
								 "VALUES ('$name')";
				  
						  if (!mysqli_query($con, $sql)) {
							  die('Error: ' . mysqli_error($con));
						  }
						  echo " record added";
						  mysqli_close($con);
					  }
				  ?>

                </div>
            </div>
        </div>
    </body>
</html>

我不知道如何在handleSchedule.php中为当天时间内用户键的部分编码。

所需的数据库输入

enter image description here

1 个答案:

答案 0 :(得分:1)

您拥有单一的名称值,即(您在标记中使用)

<input type="text" name="name" class="form-control" />

接下来你抓住“开始时间”和“结束时间”的日子,你必须重命名你的表格字段(startTime和endTime),日期字段名称应为

<input type="text" class="form-control" name="startTime[1][]" />

此处在name属性中,第一个索引是日期编号。在这种情况下,1周一你可以根据需要设置日期。

所有完成表格!!!

现在我们想要服务器端的数据。

获取您已完成的名称字段值:

$name = $_POST['name'];

现在要获取所有日子的开始时间和结束时间,我们必须循环遍历startTime或endTime字段值,如下所示:startTime字段值:

/* This loop will iterate through all days.  */
foreach($_POST["startTime"] as $day=>$startTimes){
    /* This loop will give start & end times for a particular day, i.e. $day */

    foreach($startTimes as $timeIndex=>$startTime){
        $endTime = $_POST["endTime"][$day][$timeIndex];
        /**
         * 1. You have name in $name variable.
         * 2. Day you have in $day variable.
         * 3. Start time in $startTime variable.
         * 4. End time in $endTime variable.
         *
         * TODO: Now you have all required data in respected variables 
         * You can save to Database.
         *
         */
    }        
}