Could somebody please help me these 2 questions, as I am having a hard time implementing this?
I am building an event calender with php, javascript, html and css using the help of a tutorial.
The calender highlights the current day as red. When a booking has been made, the day of which the booking is made, turns navy.
Question 1
This was a success, when the insert form was attached to the calender page. But due to some bizarre working of the code, the form ends up becoming designed in the same manner as the calender. So for example, if the month row is coloured yellow and the day row is colored grey, then for some reason, the form with the first row becomes yellow and the second row becomes grey. Essentially, the form style is weirdly attached to the calender style. How can I stop this from happening?
Question 2
The second query, is that in order to a avoid the above, I tried redirecting the user to the event form on a separate page. While the event was successfully added to the database, when I go back to the calender page, the booking date is not turned navy as before. I need the date to turn navy again as before and also display the booking details, as question 1 did successfully.
As you can tell, I am really stuck here, and need some help (I would really love to implement the second question/scenario) but the first one is also fine for me. Please find the code below for each question. Thank you so much any help you can provide.
Question 1
calender.php
<?php
//These are required to connect to the database
DEFINE ('DB_USER', 'root');
DEFINE ('DB_PASSWORD', '');
DEFINE ('DB_HOST', 'localhost');
DEFINE ('DB_NAME', 'calender');
//This variable is used for displaying error
$error="Cannot connect";
//Connect to the database
$dbconnection=mysqli_connect(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME) or die($error);
mysqli_select_db($dbconnection,"calender") or die($error);
?>
<html>
<head>
<script>
//This function represents the previous button on the calender
function goPreviousMonth(month, year){
if (month == 1) {
--year;
month = 13;
}
--month
var monthstring=""+month+"";
var monthlength=monthstring.length;
if(monthlength<=1){
monthstring="0"+monthstring;
}
//This creates the URL to state the month and year.
document.location.href = "<?php $_SERVER['PHP_SELF'];?>?month="+monthstring+"&year="+year;
}
//This function represents the next button on the calender
function goNextMonth(month, year){
if (month == 12){
++year;
month = 0;
}
++month
var monthstring=""+month+"";
var monthlength=monthstring.length;
if(monthlength<=1){
monthstring="0"+monthstring;
}
//This creates the URL to state the month and year.
document.location.href = "<?php $_SERVER['PHP_SELF'];?>?month="+monthstring+"&year="+year;
}
</script>
</head>
<link rel="stylesheet" type="text/css" href="calenderfakestyle.css">
<body>
<?php
//Check the URL to see if the user has passed a variable
//This is used to check if day has a passing variable
if (isset ($_GET['day'])){
//If true, then get the day from the URL
$day = $_GET['day'];
}else{
$day = date ("d");
}
//The is used to check if month has a passing variable
if (isset ($_GET['month'])){
//If true, then get the month from the URL
$month = $_GET['month'];
}else{
$month = date ("n");
}
//The is used to check if month has a passing variable
if (isset ($_GET['year'])){
//If true, then get the year from the URL
$year = $_GET['year'];
}else{
$year = date ("Y");
}
//The calender variables
//This stores day, month and year variables within a timestamp
$currentTimeStamp = strtotime("$year-$month-$day");
//This gets the current month name
$monthName = date("F", $currentTimeStamp);
//This determines how many days there are in the current month
$numDays = date("t", $currentTimeStamp);
//This variable is used to count cells in the loop later
$counter = 0;
?>
<?php
//This code must be below the date variable
if(isset($_GET['add'])){
$title=$_POST['txttitle'];
$detail=$_POST['txtdetail'];
$eventdate=$month."/".$day."/".$year;
$sqlinsert="insert into booking (title,detail,event_date,date_added) values ('".$title."','".$detail."','".$eventdate."',now())";
$resultinsert=mysqli_query($dbconnection,$sqlinsert);
if($resultinsert){
echo "Event was successfully added";
}else{
echo "Event was not added";
}
}
?>
<table border='1'>
<tr> <td> <input class="previousbutton" type='button' value='<' name='previousbutton' onClick="goPreviousMonth (<?php echo $month.",".$year?>)"> </td>
<td colspan='5'> <span class="title"> <?php echo $monthName." ".$year; ?> </span> </td>
<td> <input class="nextbutton" type='button' value='>' name='nextbutton' onClick="goNextMonth (<?php echo $month.",".$year?>)"> </td>
</tr>
<tr>
<td>Sun</td>
<td>Mon</td>
<td>Tue</td>
<td>Wed</td>
<td>Thu</td>
<td>Fri</td>
<td>Sat</td>
</tr> <?php echo "<tr>";
//This is used to loop from 1 to the number of days in the month
for ($i = 1; $i < $numDays+1; $i++, $counter++){
//This is a timestamp for each day in the loop
$timeStamp = strtotime ("$year-$month-$i");
//This checks if if it is the first day
if($i == 1){
//This determines which day for the first date of the month
$firstDay = date ("w", $timeStamp);
//This loop is used to make a blank cell if it is not the first day
for ($j = 0; $j < $firstDay; $j++, $counter++){
//Blank space
echo "<td> </td>";
}
}
//This checks to see if the day is on the last column. If so, a new row will be made.
if($counter % 7 == 0 ){
echo "<tr></tr>";
}
$monthstring=$month;
$monthlength=strlen($monthstring);
$daystring=$i;
$daylength=strlen($daystring);
if($monthlength<=1){
$monthstring="0".$monthstring;
}
if($daylength<=1){
$daystring="0".$daystring;
}
$todaysDate=date("m/d/Y");
$dateToCompare=$monthstring. '/' . $daystring . '/' . $year;
echo "<td align='center' ";
if($todaysDate==$dateToCompare){
echo "class='today'";
}else{
$sqlCount="select * from booking where event_date='".$dateToCompare."'";
$noOfEvent= mysqli_num_rows(mysqli_query($dbconnection,$sqlCount));
if($noOfEvent>=1){
echo "class='event'";
}
}
echo "><a href='".$_SERVER['PHP_SELF']."?month=".$monthstring."& day=".$daystring."&year=".$year."&v=true'>".$i."</a></td>";
}
echo "</tr>";
?>
</table>
<?php
if(isset($_GET['v'])){
echo "<a href='".$_SERVER['PHP_SELF']."?month=".$month."& day=".$day."&year=".$year."&v=true&f=true'>Add Event</a>";
if(isset($_GET['f'])){
include("eventform.php");
}
$sqlEvent="select * from booking where event_date='".$month."/".$day."/".$year."'";
$resultEvents=mysqli_query($dbconnection,$sqlEvent);
echo "<hr>";
while($events=mysqli_fetch_array($resultEvents)){
echo "Title : ".$events['title']."<br>";
echo "Detail : ".$events['detail']."<br>";
}
}
?>
</body>
</html>
eventform.php
<form name='eventform' method='POST' action="<?php $_SERVER['PHP_SELF']; ?>?month=<?php echo $month;?>&day=<?php echo $day;?>&year=<?php echo $year;?>&v=true&add=true">
<table width='400px'>
<tr>
<td width='150px'>Title</td>
<td width='250px'><input type='text' name='txttitle'> </td>
</tr>
<tr>
<td width='150px'>Detail</td>
<td width='250px'> <textarea name='txtdetail'> </textarea> </td>
</tr>
<tr>
<td td colspan='2'align='center'> <input type='submit' name='btnadd' value='Add Event'> </td>
</tr>
</table>
</form>
Question 2
calender.php
<?php
//These are required to connect to the database
DEFINE ('DB_USER', 'root');
DEFINE ('DB_PASSWORD', '');
DEFINE ('DB_HOST', 'localhost');
DEFINE ('DB_NAME', 'calender');
//This variable is used for displaying error
$error="Cannot connect";
//Connect to the database
$dbconnection=mysqli_connect(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME) or die($error);
mysqli_select_db($dbconnection,"calender") or die($error);
ob_start();
?>
<html>
<head>
<script>
//This function represents the previous button on the calender
function goPreviousMonth(month, year){
if (month == 1) {
--year;
month = 13;
}
--month
var monthstring=""+month+"";
var monthlength=monthstring.length;
if(monthlength<=1){
monthstring="0"+monthstring;
}
//This creates the URL to state the month and year.
document.location.href = "<?php $_SERVER['PHP_SELF'];?>?month="+monthstring+"&year="+year;
}
//This function represents the next button on the calender
function goNextMonth(month, year){
if (month == 12){
++year;
month = 0;
}
++month
var monthstring=""+month+"";
var monthlength=monthstring.length;
if(monthlength<=1){
monthstring="0"+monthstring;
}
//This creates the URL to state the month and year.
document.location.href = "<?php $_SERVER['PHP_SELF'];?>?month="+monthstring+"&year="+year;
}
</script>
</head>
<link rel="stylesheet" type="text/css" href="calenderfakestyle.css">
<body>
<?php
//Check the URL to see if the user has passed a variable
//This is used to check if day has a passing variable
if (isset ($_GET['day'])){
//If true, then get the day from the URL
$day = $_GET['day'];
}else{
$day = date ("d");
}
//The is used to check if month has a passing variable
if (isset ($_GET['month'])){
//If true, then get the month from the URL
$month = $_GET['month'];
}else{
$month = date ("n");
}
//The is used to check if month has a passing variable
if (isset ($_GET['year'])){
//If true, then get the year from the URL
$year = $_GET['year'];
}else{
$year = date ("Y");
}
//The calender variables
//This stores day, month and year variables within a timestamp
$currentTimeStamp = strtotime("$year-$month-$day");
//This gets the current month name
$monthName = date("F", $currentTimeStamp);
//This determines how many days there are in the current month
$numDays = date("t", $currentTimeStamp);
//This variable is used to count cells in the loop later
$counter = 0;
?>
<?php
//This code must be below the date variable
if(isset($_GET['add'])){
$title=$_POST['txttitle'];
$detail=$_POST['txtdetail'];
$eventdate=$month."/".$day."/".$year;
$sqlinsert="insert into booking (title,detail,event_date,date_added) values ('".$title."','".$detail."','".$eventdate."',now())";
$resultinsert=mysqli_query($dbconnection,$sqlinsert);
if($resultinsert){
echo "Event was successfully added";
}else{
echo "Event was not added";
}
}
?>
<table border='1'>
<tr> <td> <input class="previousbutton" type='button' value='<' name='previousbutton' onClick="goPreviousMonth (<?php echo $month.",".$year?>)"> </td>
<td colspan='5'> <span class="title"> <?php echo $monthName." ".$year; ?> </span> </td>
<td> <input class="nextbutton" type='button' value='>' name='nextbutton' onClick="goNextMonth (<?php echo $month.",".$year?>)"> </td>
</tr>
<tr>
<td>Sun</td>
<td>Mon</td>
<td>Tue</td>
<td>Wed</td>
<td>Thu</td>
<td>Fri</td>
<td>Sat</td>
</tr> <?php echo "<tr>";
//This is used to loop from 1 to the number of days in the month
for ($i = 1; $i < $numDays+1; $i++, $counter++){
//This is a timestamp for each day in the loop
$timeStamp = strtotime ("$year-$month-$i");
//This checks if if it is the first day
if($i == 1){
//This determines which day for the first date of the month
$firstDay = date ("w", $timeStamp);
//This loop is used to make a blank cell if it is not the first day
for ($j = 0; $j < $firstDay; $j++, $counter++){
//Blank space
echo "<td> </td>";
}
}
//This checks to see if the day is on the last column. If so, a new row will be made.
if($counter % 7 == 0 ){
echo "<tr></tr>";
}
$monthstring=$month;
$monthlength=strlen($monthstring);
$daystring=$i;
$daylength=strlen($daystring);
if($monthlength<=1){
$monthstring="0".$monthstring;
}
if($daylength<=1){
$daystring="0".$daystring;
}
$todaysDate=date("m/d/Y");
$dateToCompare=$monthstring. '/' . $daystring . '/' . $year;
echo "<td align='center' ";
if($todaysDate==$dateToCompare){
echo "class='today'";
}else{
$sqlCount="select * from booking where event_date='".$dateToCompare."'";
$noOfEvent= mysqli_num_rows(mysqli_query($dbconnection,$sqlCount));
if($noOfEvent>=1){
echo "class='event'";
}
}
echo "><a href='".$_SERVER['PHP_SELF']."?month=".$monthstring."& day=".$daystring."&year=".$year."&v=true'>".$i."</a></td>";
}
echo "</tr>";
?>
</table>
<?php
if(isset($_GET['v'])){
header("Location:eventform.php");
if(isset($_GET['f'])){
include("eventform.php");
}
$sqlEvent="select * from booking where event_date='".$month."/".$day."/".$year."'";
$resultEvents=mysqli_query($dbconnection,$sqlEvent);
echo "<hr>";
while($events=mysqli_fetch_array($resultEvents)){
echo "Title : ".$events['title']."<br>";
echo "Detail : ".$events['detail']."<br>";
}
}
?>
</body>
</html>
Eventform.php
<?php
DEFINE ('DB_USER', 'root');
DEFINE ('DB_PASSWORD', '');
DEFINE ('DB_HOST', 'localhost');
DEFINE ('DB_NAME', 'calender');
//This variable is used for displaying error
$error="Cannot connect";
//Connect to the database
$dbconnection=mysqli_connect(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME) or die($error);
mysqli_select_db($dbconnection,"calender") or die($error);
//Check the URL to see if the user has passed a variable
//This is used to check if day has a passing variable
if (isset ($_GET['day'])){
//If true, then get the day from the URL
$day = $_GET['day'];
}else{
$day = date ("d");
}
//The is used to check if month has a passing variable
if (isset ($_GET['month'])){
//If true, then get the month from the URL
$month = $_GET['month'];
}else{
$month = date ("n");
}
//The is used to check if month has a passing variable
if (isset ($_GET['year'])){
//If true, then get the year from the URL
$year = $_GET['year'];
}else{
$year = date ("Y");
}
//The calender variables
//This stores day, month and year variables within a timestamp
$currentTimeStamp = strtotime("$year-$month-$day");
//This gets the current month name
$monthName = date("F", $currentTimeStamp);
//This determines how many days there are in the current month
$numDays = date("t", $currentTimeStamp);
//This variable is used to count cells in the loop later
$counter = 0;
if(isset($_GET['add'])){
$title=$_POST['txttitle'];
$detail=$_POST['txtdetail'];
$eventdate=$month."/".$day."/".$year;
$sqlinsert="insert into booking (title,detail,event_date,date_added) values ('".$title."','".$detail."','".$eventdate."',now())";
$resultinsert=mysqli_query($dbconnection,$sqlinsert);
if($resultinsert){
echo "Event was successfully added";
}else{
echo "Event was not added";
}
}
?>
<form name='eventform' method='POST' action="<?php $_SERVER['PHP_SELF']; ?>?month=<?php echo $month;?>&day=<?php echo $day;?>&year=<?php echo $year;?>&v=true&add=true">
<table width='400px'>
<tr>
<td width='150px'>Title</td>
<td width='250px'><input type='text' name='txttitle'> </td>
</tr>
<tr>
<td width='150px'>Detail</td>
<td width='250px'> <textarea name='txtdetail'> </textarea> </td>
</tr>
<tr>
<td td colspan='2'align='center'> <input type='submit' name='btnadd' value='Add Event'> </td>
</tr>
</table>
</form>
CSS stylesheet for both questions:
table {
position: absolute;
width: 700px;
left: 50%;
margin-left: -350px;
margin-top:-30px;
text-align: center;
border-collapse: collapse;
font-size: 20px;
}
table tr td a {
text-decoration: none;
display: block;
width:100%;
padding: 20% 0;
}
td {
width: 100px;
height: 60px;
background-color: white;
}
a:link {
color: black;
}
a:visited {
color: black;
}
td:hover {
background-color: purple;
}
.previousbutton{
width: 100px;
height: 60px;
border: none;
background-color: blue;
cursor: pointer;
font-size:20px;
}
.previousbutton:hover{
background-color: #blue;
}
.nextbutton{
width: 100px;
height: 60px;
border: none;
background-color: blue;
cursor: pointer;
font-size:20px;
}
.nextbutton:hover{
background-color: #7FFFD4;
}
.today {
background-color: red;
}
.event {
background-color: navy;
}
tr:nth-child(1) td:nth-child(2){
background-color: yellow;
}
tr:nth-child(2) td:nth-child(1n){
background-color: #D3D3D3;
}
.title {
color:black;
}
The database contains the following fields:
ID
title
detail
event_date
date_added
Question 1: your CSS is too generic, so all table related elements end up with the same style.
Ex. you define
tr:nth-child(1) td:nth-child(2){
background-color: yellow;
}
tr:nth-child(2) td:nth-child(1n){
background-color: #D3D3D3;
}
This applies to ALL tr elements in ALL tables.
If you want to apply it only to the calendar table, you could add a class name to the tr in the calendar (ex caltr), and modify your css to specify tr.caltr. Then the tr in the form would not apply this style.
You use that mechanism for .today. Only td with class="today" will end up being red, so apply the same thing to your tr elements.
Question 2: once you fix question 1, is there a need for question 2 anymore? Seems like not.
Examples:
index.html
<html>
<head>
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="test2.css">
</head>
<body>
<h1>Table1</h1>
<table>
<thead>
<tr class="table1"><th>Cell1</th><th>Cell2</th></tr>
</thead>
<tbody>
<tr class="table1"><td>value1-1</td><td>Value1-2</td></tr>
<tr class="table1"><td>value2-1</td><td>Value2-2</td></tr>
<tr class="table1"><td>value3-1</td><td>Value3-2</td></tr>
</tbody>
</table>
<h1>Table2</h1>
<table>
<thead>
<tr><th>Cell1</th><th>Cell2</th></tr>
</thead>
<tbody>
<tr><td>value1-1</td><td>Value1-2</td></tr>
<tr><td>value2-1</td><td>Value2-2</td></tr>
<tr><td>value3-1</td><td>Value3-2</td></tr>
</tbody>
</table>
</body>
</html>
test2.css
/* TEST */
tr.table1:nth-child(1) td:nth-child(2){
background-color: yellow;
}
tr.table1:nth-child(2) td:nth-child(1n){
background-color: #D3D3D3;
}
Using this you will get:
See how the tr in the two tables are separate? You use the class="" attribute to differentiate between the two. You must edit your HTML and your CSS to match.
I have a php file which selects a large amount of data from mutiple sql table. Naturally it takes a long time to complete the whole process. I want to display a progress bar which will express the progress of the script running. How to display a progress bar? The script below shows a portion of the php file.
<?php
//RIGHT(AdmitCode,1), PartCode, MID(AdmitCode,2,2), MID(AdmitCode,1,1) DESC, RollCode
$query = "SELECT * FROM students1 ORDER BY PartCode, AdmitCode, yearcode desc, RollCode";
$result = mysql_query($query);
// start a table tag in the HTML
echo "<table border='1' align='center' style='border-collapse:collapse' width='110%'>";
echo "<caption>
<h2>List of candidates for Three year Degree
(Honours/General) Programme Examination-".$bx1." (".$bx2.")
</h2>
</caption>";
//$row['index'] the index here is a field name
echo "<tr bgcolor=''>
<th> Sl. No </th>
<th>ID </th>
<th> Semester </th>
<th> Roll No </th>
<th> Registration No</th>
<th> Name </th>
<th> Honours </th>
<th> Elective-1 </th>
<th> Elective-2 </th>
<th> Elective-3 </th>
<th> MIL </th>
<th> Foundation </th>
<th> Soft studies </th>
<th> Syllabus </th>
</tr>";
$ty=0;
while($row = mysql_fetch_array($result)){ //Creates a loop to loop through results
$ty++;
if ($ty%2==0)
echo "<tr bgcolor='pink'>";
else
echo "<tr>";
echo "<td align='center'>$ty</td>
<td align='center'>" . $row['StudentID']." </td>
<td align='center'>" . $row['PartCode']."</td>
<td align='center'>" . $row['AdmitRollNo'] . "</td>
<td align='center'>" . $row['RegistrationNo']. "</td>
<td align='left'>" . $row['Name'] . "</td>
<td align='center'>" . $row['HonoursSubject'] . "</td>
<td align='center'>". $row['ElectiveSubject1'] . "</td>
<td align='center'>". $row['ElectiveSubject2'] . "</td>
<td align='center'>". $row['ElectiveSubject3'] . "</td>
<td align='center'>". $row['MIL'] . "</td>
<td align='center'>". $row['Foundation'] . "</td>
<td align='center'>". $row['SoftStudies'] . "</td>
<td align='center'>". $row['Syllabus'] . "</td>
</tr>";
}
echo "</table>"; //Close the table in HTML
Generally, to implement a good progress bar, you need a progress indicator from the layer which does the work, i.e. the mysql database. I am not aware, that mysql provides such a feature.
So you are stuck with estimating how long the operation will probably last (i.e. from past queries or derive it from the query parameters) and just implement a javascript progress bar (JQueryUI provides a good one), which is just time based.
Alternatively, you could just use a spinner to indicate, that you do not know how long this process really runs.
you can add div coantainer for the table and has id page and add css this show the loading image until page full load.
eg.
<div id="page">
<table>
</table>
</div>
css
<style>
#page {
display: none;
}
#loading {
display: block;
position: absolute;
top: 0;
left: 0;
z-index: 100;
width: 100vw;
height: 100vh;
// background-image: url(loading_spinner.gif);
background-image:url("loading_spinner.gif");
background-repeat: no-repeat;
background-position: center;
}
</style>
<script>
$(window).load(function() {
$('#page').show();
$('#loading').hide('slow');
});
</script>
add this js code in your page this will help you.
You can use the following simple code
<?php
//header('Content-Type: text/event-stream');
// recommended to prevent caching of event data.
header('Cache-Control: no-cache');
//long_process.php
for($i=1;$i<=3;$i++){
//do something
echo '<br>processing...';
ob_flush();
flush();
sleep(1);
}
echo 'CLOSE', 'Process complete';
?>
Or use as following
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<br />
<input type="button" onClick="startTask()" value="Start Long Task" />
<input type="button" onClick="stopTask();" value="Stop Task" />
<br />
<br />
<p>Results</p>
<br />
<div id="results" style="border:1px solid #000; padding:10px; width:300px; height:250px; overflow:auto; background:#eee;"></div>
<br />
<progress id='progressor' value="0" max='100' style=""></progress>
<span id="percentage" style="text-align:right; display:block; margin-top:5px;">0</span>
</body>
</html>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
var es;
function startTask() {
es = new EventSource('bar2.php');
//a message is received
es.addEventListener('message', function(e) {
var result = JSON.parse( e.data );
addLog(result.message);
if(e.lastEventId == 'CLOSE') {
addLog('Received CLOSE closing');
es.close();
var pBar = document.getElementById('progressor');
pBar.value = pBar.max; //max out the progress bar
}
else {
var pBar = document.getElementById('progressor');
pBar.value = result.progress;
var perc = document.getElementById('percentage');
perc.innerHTML = result.progress + "%";
perc.style.width = (Math.floor(pBar.clientWidth * (result.progress/100)) + 15) + 'px';
}
});
es.addEventListener('error', function(e) {
addLog('Error occurred');
es.close();
});
}
function stopTask() {
es.close();
addLog('Interrupted');
}
function addLog(message) {
var r = document.getElementById('results');
r.innerHTML += message + '<br>';
r.scrollTop = r.scrollHeight;
};
</script>
Then create the following page. It has called in the index.php
bar.php
<?php
header('Content-Type: text/event-stream');
// recommended to prevent caching of event data.
header('Cache-Control: no-cache');
function send_message($id, $message, $progress) {
$d = array('message' => $message , 'progress' => $progress);
echo "id: $id" . PHP_EOL;
echo "data: " . json_encode($d) . PHP_EOL;
echo PHP_EOL;
ob_flush();
flush();
}
//LONG RUNNING TASK
for($i = 1; $i <= 10; $i++) {
send_message($i, 'on iteration ' . $i . ' of 10' , $i*10);
sleep(1);
}
send_message('CLOSE', 'Process complete');
here is the script code of my page.
i select any date and i get the data by selecting date from the database.
i want to initially set the date to today when i open my page.
then i get the data of today and of current time.
but how ???
i give you an example: this is example link.
here you can see timestamp box to show results of current date and time
i want to do it exactly like this.
but how?
<link rel="stylesheet" type="text/css" href="tcal.css" />
<script type="text/javascript" src="tcal.js"></script>
<form action="index.php" method="get">
From : <input type="text" name="d1" class="tcal" value="" />
<input type="submit" value="Search">
</form>
<table id="resultTable" data-responsive="table" style="text-align: left; width: 400px;" border="1" cellspacing="0" cellpadding="4">
<thead>
<tr>
<th> Birtday </th>
<th> Name </th>
<th> Gender </th>
</tr>
</thead>
<tbody>
<?php
include('connect.php');
if (isset($_GET["d1"])) { $d1 = $_GET["d1"]; } else { $d1="0000-00-00"; };
$result = $db->prepare("SELECT * FROM birthday WHERE date = :a");
$result->bindParam(':a', $d1);
$result->execute();
for($i=0; $row = $result->fetch(); $i++){
?>
<tr class="record">
<td><?php echo $row['date']; ?></td>
<td><?php echo $row['name']; ?></td>
<td><?php echo $row['gender']; ?></td>
</tr>
<?php
}
?>
</tbody>
</table>
replace
if (isset($_GET["d1"])) { $d1 = $_GET["d1"]; } else { $d1="0000-00-00"; };
with
if (isset($_GET["d1"])) { $d1 = $_GET["d1"]; } else { $d1=date('"Y-m-d"); };
or even shorter
$d1 = isset($_GET["d1"]) ? $_GET["d1"] : date('"Y-m-d");
to set the current date as the initial date.
Your other question is "How do i get a calendar to select a date" right? If so, just google "How do i get a calendar to select a date with php". Or search for PHP Calendar select.
This is not a free "write my code for me" website by the way. Sorry.
To get current time and date, you can use the date function. For example:
$d1 = date('Y-m-d H:i:s');
It will give you something like:
"2014-03-14 08:52:30"
I am having two drop down lists on a html page. The data is coming from a mysql database and contains information like latitude, longitude and address. The user selects one item from the drop down and clicks on submit.
At this stage, I want to display a google map and put a marker at the latitude and longitude. Then, when the user selects the option from second drop down, I want to just add a marker on that map.
Currently, I am able to load the map once he clicks the submit from first drop down but all the options I tried to drop the pins are not working.
Here is the code I have achieved till now:
<?php
error_reporting(E_ALL);
ini_set('display_errors', '1');
require_once('auth.php');
include ('LoginConfig.php');
include ('FetchAgentDetails.php');
include ('FetchDeliveryDetails.php');
?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Delivery Management System</title>
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyA0Rm5aK0BYu1f_TzhjkG97cchHHlQfrQY&sensor=false">
</script>
<style type="text/css">
html {height:100%}
body {height:100%;margin:0;padding:0}
#googleMap {height:100%}
</style>
<script>
function initialize()
{
var mapProp = {
center:new google.maps.LatLng(51.508742,-0.120850),
zoom:5,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map=new google.maps.Map(document.getElementById("googleMap")
,mapProp);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<style type="text/css">
<!--
.style1 {
font-size: 20px;
font-weight: bold;
}
-->
</style>
<style type="text/css">
table.collection {width:250px;border:2px solid black;border-style: outset;border-collapse:collapse;}
table.collection tr {background-color:#fff; border-bottom: 1px #99b solid;padding:10px;}
table.collection tr:hover {background-color:#ffe;}
table.collection td {display:table-cell;border-bottom: 1px #99b solid; padding:10px;}
table.collection td a {text-decoration:none; display:table-row; padding:0px; height:100%;}
</style>
</head>
<body bgcolor="#8E8E38"
<div style="clear: right;">
<p align="left" class="style1">Welcome Delivery Manager! </p>
<img style="position: absolute; top: 0; right: 0;" src="./Images/logo.jpg" alt="Company Logo" width="90" height="60" align="middle"></img>
</div>
<p align="left">Home</p>
<hr></hr>
<!-- START Main Wrap -->
<form method="post">
<fieldset>
<div style="clear: left;float:left;">
<label for="deliveryList">Delivery Items:</label>
<select name="deliveryList" id="deliveryList">
<option value="Select delivery item" selected="selected">Select delivery item</option>
<?php
$deliveryHandler = new FetchDeliveryDetails();
$itemNameArray = $deliveryHandler->getItemNames();
foreach ($itemNameArray as $innerArray) {
if (is_array($innerArray)) {
$value = $innerArray['itemName'];
echo "<option value=\"$value\"";
if (isset($_POST['deliveryList']) && $_POST['deliveryList'] == $value)
echo 'selected';
echo ">" . $value . "</option>\n";
}
}
?>
</select>
<input type="submit" name="submit" id="submit" value="Submit"/>
</div>
<div style="clear: right;float:right;">
<label for="agentList">Avaliable Agent:</label>
<select name="agentList" id="agentList">
<option value="" selected="selected">Select agent to assign</option>
<?php
$agentHandler = new FetchAgentDetails();
$agentNameArray = $agentHandler->getAgentNames();
foreach ($agentNameArray as $innerArray) {
if (is_array($innerArray)) {
$agentId = $innerArray['agentId'];
$firstNameValue = $innerArray['firstname'];
$lastNameValue = $innerArray['lastname'];
$fullName = $firstNameValue . ' ' . $lastNameValue;
echo "<option value=\"$agentId\">$fullName</option>\n";
}
}
?>
</select>
<input type="submit" name="agentSubmit" id="agentSubmit" value="Check Location"/>
</div>
</fieldset>
</form>
<?php
if (isset($_POST['deliveryList'])) {
$selectedItemName = $_POST['deliveryList'];
$deliveryHander = new FetchDeliveryDetails();
$itemDetailsArray = $deliveryHander->getAllDeliveryDetails($selectedItemName);
foreach ($itemDetailsArray as $valuesArray) {
$itemNameValue = $valuesArray['itemName'];
$itemDescriptionValue = $valuesArray['itemDescription'];
$ownerFirstname = $valuesArray['firstName'];
$ownerLastname = $valuesArray['lastName'];
$dateAdded = $valuesArray['dateAdded'];
$deliveryDate = $valuesArray['deliveryDate'];
$deliveryAddress = $valuesArray['deliveryAddress'];
$deliveryLatitude = $valuesArray['deliveryLatitude'];
$deliveryLongitude = $valuesArray['deliveryLongitude'];
$assignedAgent = $valuesArray['assignedAgentId'];
if ($assignedAgent == 0) {
$assignedAgent = "-";
}
echo "<table border=\"1\" align=\"left\" class =\"collection\">\n";
echo "<tr>\n";
echo "<td >Item Name:<b>$itemNameValue</td>\n";
echo "</tr>\n";
echo "<tr>\n";
echo "<td>Item Description: <b>$itemDescriptionValue</td>\n";
echo "</tr>\n";
echo "<tr>\n";
echo "<td>Owner Name: <b>$ownerFirstname $ownerLastname</td>\n";
echo "</tr>\n";
echo "<tr>\n";
echo "<td>Date Added: <b>$dateAdded</td>\n";
echo "</tr>\n";
echo "<tr>";
echo "<td>Delivery Date: <b>$deliveryDate</td>";
echo "</tr>";
echo "<tr>";
echo "<td>Delivery Address: <b>$deliveryAddress</td>";
echo "</tr>";
echo "<tr>";
echo "<td>Assigned Agent: <b>$assignedAgent</td>";
echo "</tr>";
echo "</table>";
echo "<div id=\"googleMap\" style=\"width:500px;height:380px;\"></div>";
}
}
if (isset($_POST['agentList'])) {
}
?>
</body>
</html>
I almost forgot, this is my first PHP application, in fact my first web application. So please go easy on me. Point out other errors also, but please stick to the question.
Ok got it working by using iframe :) and a bit of php
Reference:
http://www.youtube.com/watch?v=HTm-3Cduafw
echo "<iframe style =\"display: block;
width: 800px;
padding-top: 2px;
height: 400px;
margin: 0 auto;
border: 0;\" width=\"425\" height=\"350\" align=\"center\" frameborder=\"0\" scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\"
src=\"https://maps.google.com/maps?f=d&source=s_d&saddr=$agent_map_url&
daddr=$map_url&hl=en&z=10&t=m&mra=ls&ie=UTF8&output=embed\"></iframe><br/>";
I've been having a really annoying "error"...
My page have a header, left sidebar and a footer. After i submit the form everything goes really good EXCEPT now the footer is in the middle of the page!! I tried everything i knew to and searched but i still can't solve that.
BEFORE SUBMIT with footer on the right place : http://i48.tinypic.com/ly1dl.jpg
AFTER SUBMIT with footer on the middle of the page : http://i47.tinypic.com/168a3uq.jpg
Here is The code :
Header:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="stylesheets/stylesheet.css" type="text/css" rel="stylesheet" />
<title>Wilson Electric & Alarm Company</title>
</head>
<body>
<div id="header">
<h1 id="toptitle"> Wilson Electric & Alarm Company </h1>
</div>
<div id="navigation_top">
</div>
<div id="column_left">
<ul id="left_menu">
<li> Insert Page </li>
<li> Search Page </li>
<li> Menu 4 </li>
<li> Menu 5 </li>
<li> Menu 6 </li>
<li> User </li>
<li> Admin </li>
<li> Login </li>
<li> Create Username </li>
</ul>
</div>
<div id="content">
Footer :
</div>
<div id="footer">
This is a Footer.
</div>
</body>
</html>
Stylesheet : (there is also a default reset in my stylesheet before the #container)
#container {
width:100%;
height:100%;
}
#header {
width: 100%;
height:120px;
}
#column_left {
float:left;
width:15%;
height:100%;
border-right: 3px solid #06F;
border-left: 3px solid #06F;
}
#content {
width:100%;
height:100%;
}
#footer {
width:100%;
height: 30px;
border-top:3px solid #06F;
}
#navigation_top {
width:100%;
height:15px;
border-bottom:3PX solid #06F;
}
#toptitle {
padding:30px;
font-size:300%;
font-weight:700;
}
.formtitle {
font-weight:800;
font-size:150%;
}
#form {
margin-left:230px;
padding-top:30px;
}
table,th, td {
border: 1px solid black;
}
table {
width:1024px;
}
th {
font-weight:800;
background-color:#0FF;
}
And here is the page code that is giving me those problems!!
<?php require_once("includes/connection.php"); ?>
<?php require_once("includes/functions.php"); ?>
<?php
if (isset($_POST['search'])) {
$date1 = mysql_prep($_POST['date1']);
$date2 = mysql_prep($_POST['date2']);
$latte = mysql_prep($_POST['latte']);
$coffee = mysql_prep($_POST['paid']);
$query = "SELECT *
FROM payroll
WHERE (day BETWEEN '{$date1}' AND '{$date2}')
AND (company = '{$latte}')
AND (paid = '{$coffee}')
ORDER BY day ASC ";
$result = mysql_query($query, $connection);
$woof = "SELECT SUM(p.hours) AS sum_hours
, COUNT(DISTINCT p.day) AS cnt_days
FROM PAYROLL p
WHERE p.day BETWEEN '{$date1}' AND '{$date2}'
AND company = '{$latte}'
AND paid = '{$coffee}' ";
$raw = mysql_query($woof, $connection);
if(!$raw) { die(mysql_error());}
$meow = mysql_result($raw, 0, 0);
$days = mysql_result($raw, 0, 1);
if(!$result) {
echo "FAIL";
} else {
$message = "<table>
<tr>
<th> Date </th>
<th> Hours </th>
<th> Job Title </th>
<th> Job Description </th>
<th> For </th>
<th> Paid </th>
</tr>";
while($row = mysql_fetch_array($result)) {
$company = $row['company'];
if($company == 0) {
$company = "Wilson Electric";
} if($company == 1) {
$company = "Wilson Rental";
} if ($company == 2) {
$company = "Church of Christ";
}
$paid = $row['paid'];
if($paid == 0) {
$paid = "Yes";
} else {
$paid = "<form action=\"update.php\" method=\"post\" ><input type=\"checkbox\" name=\"paid\" value=\"0\"> NO ";
}
$message .= "<tr>";
$message .= "<td class=\"center\">" . $row['day'] . "</td>";
$message .= "<td class=\"center\">" . $row['hours'] . "</td>";
$message .= "<td style=\"padding:5px;\">" . $row['job_title'] . "</td>";
$message .= "<td style=\"padding:5px;\">" . $row['job_description'] . "</td>";
$message .= "<td style=\"padding:5px;\">" . $company . "</td>";
$message .= "<td class=\"center\">" . $paid . "</td>";
$message .= "</tr>";
}
$message .= "<tr>";
$message .= "<td class=\"center\"> Total Days: " . $days . "</td>";
$message .= "<td class=\"center\"> Total Hours: " . $meow . "</td>";
$message .= "<td class=\"center\"> </td>";
$message .= "<td class=\"center\"> </td>";
$message .= "<td class=\"center\"> </td>";
$message .= "<td class=\"center\"> <input type=\"submit\" name=\"gamind\" value=\"Update\"> </form> </td>";
$message .= "</tr>";
}
}
?>
<?php include("includes/header.php"); ?>
<form action="" method="post" id="form">
<h1 class="formtitle"> Search </h1>
<br />
<table id="table1">
<th> From </th>
<th> To </th>
<th> For </th>
<th> Paid </th>
<tr>
<td>
<input type="date" name="date1" value="" >
</td>
<td>
<input type="date" name="date2" value="" >
</td>
<td>
<select name="latte" >
<option value="0"> Wilson Electric </option>
<option value="1"> Wilson Rental </option>
<option value="2"> Church of Christ</option>
</select>
</td>
<td>
<input type="radio" name="paid" value="0"> Yes <br />
<input type="radio" name="paid" value="1"> No <br />
</tr>
<tr>
<td colspan="4" align="right"> <input type="submit" name="search" value="Search">
</td>
</tr>
</table>
<br />
<br />
<p>
<?php
if(!empty($message)) {
echo "<h1 class=\"formtitle\"> Payroll Result </h1>";
echo $message;
}
?>
</p>
</form>
<?php include("includes/footer.php"); ?>
<?php mysql_close($connection); ?>
Sorry for the loooong post!! I hope someone knows the solution for my problem!
Thanks! :)
There's a lot of code here to take in, but I think your $message builds <tr>s, but when you echo $message, you're not inside a table element..?