My people table has rows which need a value of 1 if checked and 0 if not. I used checkboxes to collect that in my form. I also wanted to allow the user to add more fields so if they can multiple entries can be made at a time.
I scraped out how to collect the unchecked boxes by creating a hidden input for each checkbox by creating a input type=hidden before the checkboxes, so I just copied the whole table row for the jQuery to append.
Unfortunately, the checkbox values mess up on every other row: (the lName column specifies the input on the following boolean columns: Y should be a check and N is blank)
The first row is correct, but I don't know why the appended rows are being screwed.
<?php
include_once("connections/db.inc.php");
if(isset($_POST['submit'])){
//addresses
$roomNumber=$_POST['roomNumber'];
$houseNumber=$_POST['houseNumber'];
$block=$_POST['block'];
$lot=$_POST['lot'];
$street=$_POST['street'];
$subdivision=$_POST['subdivision'];
$barangay=$_POST['barangay'];
$city=$_POST['city'];
$province=$_POST['province'];
//insert address first
$sql = "INSERT INTO `addresses` (`roomNumber`, `houseNumber`, `block`, `lot`, `street`, `subdivision`, `barangay`, `city`, `province`)
VALUES (:a1, :b1, :c1, :d1, :e1, :f1, :g1, :h1, :i1)";
$sql2 = "SELECT LAST_INSERT_ID() AS 'lastId'";
$stmt = $db->prepare($sql);
$stmt2 = $db->prepare($sql2);
$stmt->bindParam(":a1",$roomNumber);
$stmt->bindParam(":b1",$houseNumber);
$stmt->bindParam(":c1",$block);
$stmt->bindParam(":d1",$lot);
$stmt->bindParam(":e1",$street);
$stmt->bindParam(":f1",$subdivision);
$stmt->bindParam(":g1",$barangay);
$stmt->bindParam(":h1",$city);
$stmt->bindParam(":i1",$province);
$stmt->execute();
$stmt2->execute();
$row = $stmt2->fetch();
$lastId = $row[0];
//insert people
$lName=$_POST['lName'];
$fName= $_POST['fName'];
$mName= $_POST['mName'];
$suffixName= $_POST['suffixName'];
$gender= $_POST['gender'];
$birthday= $_POST['birthday'];
$phoneNumber= $_POST['phoneNumber'];
$civilStatus= $_POST['civilStatus'];
$isHeadofFamily=$_POST['isHeadOfFamily'];
$isEmployed=$_POST['isEmployed'];
$isSelfEmployedInBusiness=$_POST['isSelfEmployedInBusiness'];
$isSelfEmployedInInformalSector=$_POST['isSelfEmployedInInformalSector'];
$isSoloParent=$_POST['isSoloParent'];
$isSeniorCitizen=$_POST['isSeniorCitizen'];
$isPWD = $_POST['isPWD'];
$relationToHeadOfFamily= $_POST['relationToHeadOfFamily'];
foreach ($lName as $key => $value) {
$sql = "INSERT INTO `people` (`addressId`, `lName`, `fName`, `mName`, `suffixName`, `gender`, `birthday`, `phoneNumber`, `civilStatus`, `isHeadOfFamily`, `isEmployed`, `isSelfEmployedInBusiness`, `isSelfEmployedInInformalSector`, `isSoloParent`, `isSeniorCitizen`, `isPWD`, `relationToHeadOfFamily`)
VALUES (:lastId,:a2,:b2,:c2,:d2,:e2,:f2,:g2,:h2,:i2,:j2,:k2,:l2,:m2,:n2,:o2,:p2)";
$stmt = $db->prepare($sql);
$stmt->bindParam(":lastId",$lastId);
$stmt->bindParam(":a2",$lName[$key]);
$stmt->bindParam(":b2",$fName[$key]);
$stmt->bindParam(":c2",$mName[$key]);
$stmt->bindParam(":d2",$suffixName[$key]);
$stmt->bindParam(":e2",$gender[$key]);
$stmt->bindParam(":f2",$birthday[$key]);
$stmt->bindParam(":g2",$phoneNumber[$key]);
$stmt->bindParam(":h2",$civilStatus[$key]);
$stmt->bindParam(":i2",$isHeadofFamily[$key]);
$stmt->bindParam(":j2",$isEmployed[$key]);
$stmt->bindParam(":k2",$isSelfEmployedInBusiness[$key]);
$stmt->bindParam(":l2",$isSelfEmployedInInformalSector[$key]);
$stmt->bindParam(":m2",$isSoloParent[$key]);
$stmt->bindParam(":n2",$isSeniorCitizen[$key]);
$stmt->bindParam(":o2",$isPWD[$key]);
$stmt->bindParam(":p2",$relationToHeadOfFamily[$key]);
$stmt->execute();
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BRGY</title>
<!-- <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js" integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/a13d5dfb35.js" crossorigin="anonymous"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/style.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(function() {
var html = '<tr> <td><input type="text" name="lName[]" id="lName" ></td> <td><input type="text" name="fName[]" id="fName" ></td> <td><input type="text" name="mName[]" id="mName"></td> <td><input type="text" name="suffixName[]" id="suffixName" ></td> <td> <select name="gender[]" id="gender"> <option value="Male">Male</option> <option value="Female">Female</option> </select> </td> <td><input type="date" name="birthday[]" id="birthday" ></td> <td><input type="text" name="phoneNumber[]" id="phoneNumber" ></td> <td> <select name="civilStatus[]" id="civilStatus"> <option value="Single">Single</option> <option value="Married">Married</option> <option value="Widowed">Widowed</option> </select> </td> <td><input type="checkbox" name="isHeadOfFamily[]" id="isHeadOfFamily" value="1"> </td> <input type="hidden" name="isHeadOfFamily[]" id="isHeadOfFamilyHIDDEN" value="0"> <td><input type="checkbox" name="isEmployed[]" id="isEmployed" value="1"> </td> <input type="hidden" name="isEmployed[]" id="isEmployedHIDDEN" value="0"> <td><input type="checkbox" name="isSelfEmployedInBusiness[]" id="isSelfEmployedInBusiness" value="1"> </td> <input type="hidden" name="isSelfEmployedInBusiness[]" id="isSelfEmployedInBusinessHIDDEN" value="0"> <td><input type="checkbox" name="isSelfEmployedInInformalSector[]" id="isSelfEmployedInInformalSector" value="1"> </td> <input type="hidden" name="isSelfEmployedInInformalSector[]" id="isSelfEmployedInInformalSectorHIDDEN" value="0"> <td><input type="checkbox" name="isSoloParent[]" id="isSoloParent" value="1"> </td> <input type="hidden" name="isSoloParent[]" id="isSoloParentHIDDEN" value="0"> <td><input type="checkbox" name="isSeniorCitizen[]" id="isSeniorCitizen" value="1"> </td> <input type="hidden" name="isSeniorCitizen[]" id="isSeniorCitizenHIDDEN" value="0"> <td><input type="checkbox" name="isPWD[]" id="isPWD" value="1"> </td> <input type="hidden" name="isPWD[]" id="isPWDHIDDEN" value="0"> <td> <select name="relationToHeadOfFamily[]" id="relationToHeadOfFamily"> <option value="Spouse">Spouse</option> <option value="Child">Child</option> <option value="Sibling">Sibling</option> <option value="Parent">Parent</option> <option value="None">None</option> </select> </td> <td><button type="button" name="addmore" id="addmore">Add More</button></td> </tr>';
var x = 1;
$("#addmore").click(function(){
$("#table_input-people").append(html);
});
$("#table_input-people").on('click','#remove',function(){
$(this).closest('tr').remove();
});
});
</script>
</head>
<body>
<?php include_once("nav.php") ?>
<div>
<form action="" method="post">
<table class="table table-bordered" id="table_input">
<tr>
<th>Room Number</th>
<th>House Number</th>
<th>Block</th>
<th>Lot</th>
<th>Street</th>
<th>Subdivision</th>
<th>Barangay</th>
<th>City</th>
<th>Province</th>
</tr>
<tr>
<td><input type="text" name="roomNumber" id="roomNumber" ></td>
<td><input type="text" name="houseNumber" id="houseNumber"></td>
<td><input type="text" name="block" id="block" ></td>
<td><input type="text" name="lot" id="lot"></td>
<td><input type="text" name="street" id="street"></td>
<td><input type="text" name="subdivision" id="subdivision"></td>
<td><input type="text" name="barangay" id="barangay" ></td>
<td><input type="text" name="city" id="city"></td>
<td><input type="text" name="province" id="province"></td>
</tr>
</table>
<table class="table table-bordered" id="table_input-people">
<tr>
<th>Last Name</th>
<th>First Name</th>
<th>Middle Name</th>
<th>Suffix</th>
<th>Gender</th>
<th>Birthday</th>
<th>Phone Number</th>
<th>Civil Status</th>
<th>Are you the head of family?</th>
<th>Employed</th>
<th>Self Employed in Business</th>
<th>Self Employed in Informal Sector</th>
<th>Solo Parent</th>
<th>Senior Citizen</th>
<th>PWD</th>
<th>Relation to Head of Family</th>
</tr>
<tr>
<td><input type="text" name="lName[]" id="lName" ></td>
<td><input type="text" name="fName[]" id="fName" ></td>
<td><input type="text" name="mName[]" id="mName"></td>
<td><input type="text" name="suffixName[]" id="suffixName" ></td>
<td>
<select name="gender[]" id="gender">
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</td>
<td><input type="date" name="birthday[]" id="birthday" ></td>
<td><input type="text" name="phoneNumber[]" id="phoneNumber" ></td>
<td>
<select name="civilStatus[]" id="civilStatus">
<option value="Single">Single</option>
<option value="Married">Married</option>
<option value="Widowed">Widowed</option>
</select>
</td>
<td><input type="checkbox" name="isHeadOfFamily[]" id="isHeadOfFamily" value="1"> </td>
<input type="hidden" name="isHeadOfFamily[]" id="isHeadOfFamilyHIDDEN" value="0">
<td><input type="checkbox" name="isEmployed[]" id="isEmployed" value="1"> </td>
<input type="hidden" name="isEmployed[]" id="isEmployedHIDDEN" value="0">
<td><input type="checkbox" name="isSelfEmployedInBusiness[]" id="isSelfEmployedInBusiness" value="1"> </td>
<input type="hidden" name="isSelfEmployedInBusiness[]" id="isSelfEmployedInBusinessHIDDEN" value="0">
<td><input type="checkbox" name="isSelfEmployedInInformalSector[]" id="isSelfEmployedInInformalSector" value="1"> </td>
<input type="hidden" name="isSelfEmployedInInformalSector[]" id="isSelfEmployedInInformalSectorHIDDEN" value="0">
<td><input type="checkbox" name="isSoloParent[]" id="isSoloParent" value="1"> </td>
<input type="hidden" name="isSoloParent[]" id="isSoloParentHIDDEN" value="0">
<td><input type="checkbox" name="isSeniorCitizen[]" id="isSeniorCitizen" value="1"> </td>
<input type="hidden" name="isSeniorCitizen[]" id="isSeniorCitizenHIDDEN" value="0">
<td><input type="checkbox" name="isPWD[]" id="isPWD" value="1"> </td>
<input type="hidden" name="isPWD[]" id="isPWDHIDDEN" value="0">
<td>
<select name="relationToHeadOfFamily[]" id="relationToHeadOfFamily">
<option value="Spouse">Spouse</option>
<option value="Child">Child</option>
<option value="Sibling">Sibling</option>
<option value="Parent">Parent</option>
<option value="None">None</option>
</select>
</td>
<td><button type="button" name="addmore" id="addmore">Add More</button></td>
</tr>
</table>
<button type ="submit" name="submit">Submit</button>
</form>
</div>
<script src="js/nav.js"></script>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire