I'm new to this site and new to PHP, although I already know some HTML.
But, let's get to the point... I want to design a website where there are 2 buttons, one for present and one for absent. When clicked on one of those buttons, there needs to be a file saved with this data in it.
A little explanation:
PersonX sees a name, clicks on the button PRESENT. A file is created where the name + PRESENT/ABSENT is showed. PersonX sees another name, clicks on the button ABSENT, in the same file that was created, there's another name with the data in it.
I understood what exactly you wanted as I have also been through such challenges in the early stage of my learning career. Thus I have prepared a complete page just for you. Here it is. Feel free to ask for any further help.
<?php
$students = array("Student1", "Student2", "Student3", "Student4");
if ($_POST) {
$response = array();
$response["success"] = FALSE;
$name = (isset($_POST["name"])) ? $_POST["name"] : '--';
$present = (isset($_POST["present"])) ? $_POST["present"] : false;
$marked = ($present=="true") ? "Present" : "Absent";
$content = $name . ": " . $marked . "
";
try {
$file_name = "Records.txt";
file_put_contents($file_name, $content,FILE_APPEND);
$response["success"] = TRUE;
} catch (Exception $exc) {
$response["success"] = FALSE;
$response["message"] = $exc->getMessage();
}
echo json_encode($response);
exit;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Students Records</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h2>Student Attendance Records</h2>
<p>Maintain students attendance record using this application. Created using Core PHP, HTML, CSS, JavaScript and bootstrap libraries.</p>
<table class="table table-hover">
<thead>
<tr>
<th>Name</th>
<th>Date</th>
<th>Present/Absent</th>
</tr>
</thead>
<tbody>
<?php foreach ($students as $student) { ?>
<tr>
<td><?php echo $student; ?></td>
<td><?php echo date('d/m/Y'); ?></td>
<td><button type="button" class="btn btn-success" onclick="attendance(this)">Present</button> <button type="button" class="btn btn-danger" onclick="attendance(this)">Absent</button></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</body>
</html>
<script type="text/javascript">
function attendance(obj) {
var name = jQuery(obj).parent().siblings(':first').html();
var present = false;
if (jQuery(obj).hasClass("btn-success")) {
present = true;
}
var marked = (present) ? "Present" : "Absent";
jQuery.ajax({
url: "http://localhost/attendance/index.php",
method: "POST",
type: "JSON",
data: {name: name, present: present},
success: function(data) {
if (data) {
alert(name + " has been marked " + marked);
} else {
alert("There was an error please check Console for more details.")
console.log(data);
}
}
});
}
</script>
I dont know why are you getting this msg at the top..I just copied the entire code from this site, pasted in another file and it ran correctly. Try copying it again. Anyways what I am doing here is that firstly I display a table containing names of student. I used an array or names and generated tags of each name. Then using javascript I called a method on click of each button. This method using javascript selectors gets the sibling tag which contains the name of the student. Now I have the name of the student. Similarly by checking the class of the button I can find out if the student is present or absent. As the present button has class "btn-success". Now using ajax I send this data to the same page. Now this time if($_POST) condition will be true as post will contain the values for name and present. Then inside that condition I store the name of the student in one variable $name and the value of present in $present. By these two values I created a string which will look like : "StudentName: Present", depending upon the name and present/absent of the student. this string is then written on to a file using file_put_contents method. If everything works fine the response array will contain a variable "success" having value true. If not success will be false and response array will contain another variable "message" having the error message. This data is received by the ajax and then alert is displayed.