I am building an online system where the users are instructors of a certain college institution. One of the main function of the system is for the users to be able to view their schedules via internet.
I am currently building the page where the users view their schedule, and what I have done is create a select option in it that triggers a jquery function (that does an ajax request) when the value is changed. The requested page is then displayed on a div in the current page.
The problem is, when I try to change the value of a select option, the page occasionally displays a huge white blank on top of my whole page. I don't know what triggers the bug since it only happens occasionally, not every time. When i reload the page, the white space disappears.
I have been searching for answers everywhere and did not get one that fits my problem.
This is the page before the white space shows up
https://lh6.googleusercontent.com/-rb0XXjcpn6w/UPiwjIY92OI/AAAAAAAAABo/BmiDIbZWcxU/s640/before.jpg
This is the page when the white space shows up
https://lh3.googleusercontent.com/-RZxh2P3Bk0o/UPiwRv5oHHI/AAAAAAAAABc/VIB6LYvPBE4/s640/after.jpg
I hope you guys can help me out...
this is the code of the page..
<?php
require_once("../includes/initialize.php");
$adminEmps = employee::find_by_cond("(department = 'ACADEMIC-TEACHING' or department = 'ACADEMIC-NON TEACHING') and emp_status='active' order by lastname asc");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Schedule</title>
</head>
<script type="text/javascript">
function selectEmp(){
$('#here').html("<img src=../Images/gif/loading14.gif' class='three columns centered'>");
$.post('viewSched.php','id='+$('#selector').val()+'&yr='+$('#yrselect').val(),
function (response){
$('#here').html(response);
});
}
</script>
<body>
<?php include("AdminDropdown.php"); ?>
<div class="row">
<div class="twelve columns">
<div class="row panel">
<h2><img src="../Images/Shedule.png" height="100px" width="100px" style="vertical-align:middle"/>
Schedule
</h2>
<dl class="tabs pill">
<dd class="active">Academic</dd>
<dd>Administrative</dd>
<dd class="hide-for-small">OSAS</dd>
</dl>
</div>
<ul class="tabs-content">
<li class="active" id="simple1Tab">
<div class="two columns">
Select Employee
</div>
<div class="three columns end">
<select id='selector' onchange="selectEmp()" >
<option>--Select--</option>
<?php
foreach ($adminEmps as $key => $value) {
echo "<option value={$value['emp_ID']}>{$value['lastName']}, {$value['firstName']} {$value['lastName']}</option>";
}
?>
</select>
</div>
<div class='two columns'>
</div>
<div class='two columns' style='text-align:right;'>
Select Year
</div>
<div class='three columns end'>
<select id='yrselect' onchange="selectEmp()">
<option>-- Select --</option>
<?php
for ($i=2008; $i <= date('Y'); $i++) {
$yr = $i + 1;
echo "<option>{$i}-{$yr}</option>";
}
?>
</select>
</div>
<br>
<br>
<div class="twelve columns ">
<div class="nine columns centered">
<div id='here'>
</div>
</div>
</div>
</li>
<li id="simple2Tab"></li>
<li id="simple3Tab">This is simple tab 3s content.</li>
</ul>
</div>
</div>
<?php include("adminfooter.php"); ?>
</body>
</html>
and this is the code of the requested page.
<?php
require_once('../includes/initialize.php');
$id = $_POST['id'];
$yr = $_POST['yr'];
$info = sched::find_scheds_by_id_yr($id,$yr);
$display = "<table>
<thead>
<tr>
<th>Day</th>
<th>Time Start</th>
<th>Time End</th>
<th>Room</th>
<th>Subject</th>
</tr>
</thead>
<tbody>
";
if($info){
foreach ($info as $key2 => $value2) {
$display .= "<tr>
<td>".$value2['day']."</td>
<td> ".$value2['time_start']."</td>
<td>{$value2['time_end']}</td>
<td>{$value2['room']}</td>
<td>{$value2['Subject_description']}</td>
</tr>";
}
}
$display.="</tbody>
</table>";
?>
<html>
<head><title></title></head>
<body>
<?php echo $display; ?>
</body>
</html>
By the way this only happens in google chrome.
Going by your source files, the only javascript visible changes the content of the #here div, to a loading image inside an img tag, or to the result of the AJAX call.
Since nothing but this div seems to be changing, you should take a look at the css and see if its correctly handling a div with dynamic content (i.e, a div whose contents will be changing in size).
Look for how it's being positioned/sized, and how you're handling the overflow property.
Related
I'm making a website for my school and my website is like a laptop store and the main thing in my webpage is a product filter. I have made the product filter, it works great, but the problem is that I added shortcuts that send you to a single product page by clicking one of the products in the product filter. You can click on a product when you just came in the website and haven't messed with the product filter and it sends you to the single product page, but once you search for something using the filter the filtrated product cant be clicked on and you have to refresh the page to select your product. This is happening, because when you come in the website, you see index.php, but once you use the product filter, you are seeing action.php.
here is a part of my code from index.php:
<?php
$sql="SELECT * FROM Laptop";
$result=$conn->query($sql);
if ($result-> num_rows > 0) {
while($row=$result->fetch_assoc()){
$Laptop_ID = $row['Laptop_ID'];
?>
<?php echo "<a href='single_laptop.php?Laptop=" . $Laptop_ID ."'>" ?>
<div class="col-md-3 mb-2" style="color: blue">
<div class="card-deck">
<div class="card boarder-secondary">
<div class="card-img-overlay">
<h6 class="text-light bg-success text-center rounded p-1">
<?= $row['Nosaukums']; ?></h6>
</div>
<br>
<img src="<?= $row['Bilde']; ?>" class="card-img-top">
<div class="card-body">
<p>
Procesors : <?= $row['Procesors']; ?><br>
Videokarte : <?= $row['Videokarte']; ?><br>
RAM : <?= $row['RAM']; ?><br>
</p>
</div>
</div>
</div>
</div>
<?php }
}else {
echo "nav rezultātu";
}?>
</div>
</div>
</div>
And here is my action.php:
<?php
require 'dataB.php';
if(isset($_POST['action'])){
$sql = "SELECT * FROM Laptop WHERE Modelis !=''";
if(isset($_POST['Modelis'])){
$Modelis = implode("','", $_POST['Modelis']);
$sql .="AND Modelis IN('".$Modelis."')";
}
if(isset($_POST['Tips'])){
$Tips = implode("','", $_POST['Tips']);
$sql .="AND Tips IN('".$Tips."')";
}
if(isset($_POST['RAM'])){
$RAM = implode("','", $_POST['RAM']);
$sql .="AND RAM IN('".$RAM."')";
}
if(isset($_POST['Procesors'])){
$Procesors = implode("','", $_POST['Procesors']);
$sql .="AND Procesors IN('".$Procesors."')";
}
if(isset($_POST['Videokarte'])){
$Videokarte = implode("','", $_POST['Videokarte']);
$sql .="AND Videokarte IN('".$Videokarte."')";
}
$result = $conn->query($sql);
$output='';
if($result->num_rows>0){
while($row=$result->fetch_assoc()){
$output .='
<div class="col-md-3 mb-2" style="color: blue">
<div class="card-deck">
<div class="card boarder-secondary">
<div class="card-img-overlay">
<h6 class="text-light bg-success text-center rounded p-1">
'.$row['Nosaukums'].'</h6>
</div>
<br>
<img src="'.$row['Bilde'].'" class="card-img-top">
<div class="card-body">
<p>
Procesors : '.$row['Procesors'].'<br>
Videokarte : '.$row['Videokarte'].'<br>
RAM : '.$row['RAM'].'<br>
</p>
</div>
</div>
</div>
</div>';
}
} else {
$output = "<h3>No Products Found!<h3>";
}
echo $output;
}
?>
I need to figure out how to properly put the code from index.php, where it makes it possible to redirect me to single.laptop.php, to action.php, so I can redirect to single_laptop.php with no problems using the product filter.
$(document).keydown(function(e){
var keycode=e.keyCode;
if (keycode == 27)
{
$("#change").trigger('click');
}
});
$("#change").click(function() {
//do what you need
if($("#radio:checked").length==0)
{
alert("abc");
return false;
}
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap#3.3.7/dist/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap#3.3.7/dist/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
Press ESC
</body>
</html>
I am working on a website where I am getting input of semester number from the user and I want to display the subjects in the semester they entered accordingly.
For this, I planned to create tables for each semester which would have the subjects in it.
For now, I am successful to retrieve data from one table. But I am required to get subjects as per the entered semester by the student.
Following is the code,which works perfectly for semester 5. Please suggest alterations as per the requirements asked above.
<!DOCTYPE html>
<html>
<head>
<title></title>
<!-- very important -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="subject.css">
</head>
<body>
<h1 class="text-center text-capitalize font-weight-bold">Subject Information</h1>
<div class="container">
<div>
<br>
<div>
<form class="form-inline">
<!-- <div class="mx-auto" style="width: 200px;"> -->
<div class="form-group">
<label for="Sem"> Semester: </label>
<div>
<input type="text" name="sem_no" placeholder="Enter current semester" id=sem class="form-control">
</div>
<br>
</div>
</form>
</div>
</div>
</div>
<div>
<!-- TABLE DISPLAYED WITH DATA FROM RESPECTIVE DATABASE -->
<div class= "container">
<div class="col-lg-12 ">
<br><br>
<h2 class="text-center">Subjects</h2>
<table class="table table-striped table-hover table-bordered">
<tr>
<th>Subject code</th>
<th>Subject Name</th>
<th>Faculty name</th>
</tr>
<?php
$con = mysqli_connect('localhost','root');
mysqli_select_db($con,'subjects');
$q= "select * from sem5";
$query = mysqli_query($con,$q);
while($res = mysqli_fetch_array($query))
{
?>
<tr>
<td><?php echo $res['subject_no']; ?></td>
<td><?php echo $res['subject_name']; ?></td>
<td><?php echo $res['faculty_name']; ?></td>
</tr>
<?php
}
?>
</table>
</div>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</body>
</html>
Please suggest alterations. Will be highly obliged.
You need to do a HTTP GET request and use PHP to get the value. Then use PHP to make the SQL query. Here it is in its simplest form.
I've added a submit button which submits the form and executes the HTTP GET with the parameters attached to the URL. You will see ?sem_no=x after it is submitted. That's the Query String.
...
...
<div class="form-group">
<label for="Sem"> Semester: </label>
<div>
<input type="text" name="sem_no" placeholder="Enter current semester" id=sem class="form-control">
</div>
<div>
<input type="submit"/>
</div>
<br>
...
...
...
...
//check the value was submitted and it is not blank
<?php if(isset($_GET['sem_no']) && !empty($_GET['sem_no'])) { ?>
<!-- TABLE DISPLAYED WITH DATA FROM RESPECTIVE DATABASE -->
<div class= "container">
<div class="col-lg-12 ">
<br><br>
<h2 class="text-center">Subjects</h2>
<table class="table table-striped table-hover table-bordered">
<tr>
<th>Subject code</th>
<th>Subject Name</th>
<th>Faculty name</th>
</tr>
<?php
$con = mysqli_connect('localhost','root');
mysqli_select_db($con,'subjects');
$q= 'select * from sem'.$_GET['sem_no'];
$query = mysqli_query($con,$q);
while($res = mysqli_fetch_array($query))
{
?>
<tr>
<td><?php echo $res['subject_no']; ?></td>
<td><?php echo $res['subject_name']; ?></td>
<td><?php echo $res['faculty_name']; ?></td>
</tr>
<?php
}
?>
</table>
</div>
</div>
<?php
//closing if
} ?>
...
...
As mentioned in the comments earlier, this database design is quite poor. I know you are learning though. Have you considered having a subjects table that has a Semester column? Then you could do a query like:
SELECT * FROM subjects where semester_number = x
There are even better ways to do it beyond that but this would be a good starting point for you.
I'm working on a site which displays a blog and a photo gallery, which both get all their data from a MySQL-database using the same code (see below).
<?php
include_once("sql/db_connect.php");
$query1 = $db->prepare("SELECT post_id, title, body, img, timeposted FROM blogposts ORDER BY post_id DESC");
$query2 = $db->prepare("SELECT img_id, imgsrc FROM gallery ORDER BY img_id DESC");
$query1->execute();
$query2->execute();
$query1->bind_result($post_id, $title, $body, $img, $timeposted);
$query2->bind_result($img_id, $imgsrc);
?>
<!DOCTYPE html>
<html>
<head>
...
</head>
<body>
<header>...</header>
<main>
<div class="container">
<div>
<!-- Choose between tabs -->
</div>
<div class="wrapper1">
<?php
while($query1->fetch()):
?>
<div class="w3-col s12 m6">
<div class="card w3-depth-1">
<div class="cardheader">
<?php echo $timeposted ?>
<span></span>
</div>
<div class="cardmain">
<div class="cardtext">
<h1><?php echo $title ?></h1>
<p><?php echo $body ?></p>
</div>
<?php
if($img !== "NOPE") {
echo "<img src='uploads/" . $img . "' class='blogimage' />";
}
?>
</div>
</div>
</div>
<?php endwhile?>
</div>
<div class="wrapper2">
<?php
while($query2->fetch()):
?>
<div class="w3-col s12 m6">
<?php echo "<img src='uploads/" . $imgsrc . "' class='galleryphoto' />"; ?>
</div>
<?php endwhile?>
</div>
</div>
</main>
<footer>...</footer>
</body>
The div "wrapper1" is used for the blog, "wrapper2" for the gallery and at the top of the page there is a button which lets you switch between views (using jQuery). So on default, wrapper1 is displayed, but on clicking the button it will switch to wrapper2.
Now, my problem: in wrapper1, all blogposts are displayed, but in wrapper2, none of the pictures stored in the database are displayed at all.
And, before you ask, yes, the table is actually called "gallery" and the values are actually called "img_id" and "imgsrc". I guess I've checked that about ten times already.
When I placed "echo 'Hello World';" before the second while loop, the page said Hello World, but when I placed it in the while loop, the page still didn't display anything; that said, it shouldn't be the jQuery, I guess.
I hope that anybody can point out what I'm doing wrong. Thanks in advance! If there's any additional data / code you need to have, I'd be happy to provide that.
i'm working on a form in php mysql. so in my page there is a form and below that i shown the data of that form in table format.now i want to print only the table structure thats why i just made a PRINT button as:
<span style="float:right;">PRINT</span>
but it will print the whole page with form field and table and i just want the tableto print.
Here is the design of my whole page with form and table:
<html>
<head></head>
<body>
<div class="container">
<form class="form-horizontal" action="" method="post" name="userform1" id="company-form" enctype="multipart/form-data">
<?php if($_GET[id]){?>
<fieldset>
<legend>Add Company</legend>
<div class="control-group">
<label class="control-label">Company Name</label>
<div class="controls">
<input type="text" name="company" id="company" value="<?php echo $selup['company']?>">
</div>
</div>
<div class="control-group">another field</div>
<div class="control-group">another field</div>
<div class="control-group">
<div class="controls">
<button type="submit" class="btn" name="submit" id="submit" value="Submit">Submit</button>
</div>
</div>
<table class="table table-bordered">
<tbody>
<tr>
<td>S.No.</td>
<td>Company Name</td>
<td>Type</td>
<td>Action</td>
</tr>
<?php
// to print the records
$select = "select * from company where type='Miscellaneous'";
$query1 = mysql_query($select);
while($value = mysql_fetch_array($query1)){ ?>
<tr>
<td><?php echo $value[id];?></td>
<td><?php echo $value[company ];?></td>
<td><?php echo $value[type];?></td>
<!--<td> </td>-->
<?php /*?><td><?php echo $value[amount];?></td>
<td><?php echo $value[date];?></td><?php */?>
<td><i class="icon-edit"></i>
<i class="icon-trash"></i></td>
</tr><?php }?>
</tbody>
</table>
</fieldset>
<form>
</div>
</body>
so i just want to print the table not whole page.
Use css to hide elements you don't want to print:
#media print {
.control-group {
display: none;
}
}
function printContent(el){
var restorepage = document.body.innerHTML;
var printcontent = document.getElementById(el).innerHTML;
document.body.innerHTML = printcontent;
window.print();
document.body.innerHTML = restorepage;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>My page</h1>
<div id="div1">DIV 1 content...</div>
<button onclick="printContent('div1')">Print Content</button>
<div id="div2">DIV 2 content...</div>
<button onclick="printContent('div2')">Print Content</button>
<p id="p1">Paragraph 1 content...</p>
<button onclick="printContent('p1')">Print Content</button>
</body>
</html>
You could make a print-css (which does the same as #media print, but I think it is cleaner, and you can disable the css include via javascript, if you need it):
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
In that css, you hide all elements which should not get printed, for example:
.wrapper, .header {display: none;}
One posible solution, perhaps not the best option:
1. Open a new window with JS
2. Copy the whole table into the new window (with jQuery for example)
3. Print the new window
4. Close the window
Sure it has a blink effect but It will work.
I am new to php and been taking a php programing class this summer semester and i was wondering if someone can help me figure what i need to do in order for things to work.
I am working on a final project and we had to build our on little database on the subject that we wanted. So I choose to do a movie database. And I had used some code already from my_guitar_shop from murach's php book. which is the Murach's php and mysql book. And for some reason when I go to index.php page, I can not get my information to show up in my table on my page.
I will show you the code for my index page
<?php
require_once('database.php');
if (isset($_POST['deleteThis'])) {
$deleteThis = $_POST['deleteThis'];
$sqlDel="DELETE FROM categories WHERE categoryID = $deleteThis";
$temp=$db->exec($sqlDel);
}
// Get all categories
$query = 'SELECT * FROM categories
ORDER BY categoryID';
$categories = $db->query($query);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<!-- the head section -->
<head>
<title>My Movie Store</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<!-- the body section -->
<body>
<center>
<div id="heading">My Movie Store</div>
</center>
<div id="page">
<div id="header">
<h1>Top Movies</h1>
</div>
<div id="main">
<h1>Movie List</h1>
<table class="content">
<tr>
<th>Title</th>
<th>Date</th>
<th> </th>
</tr>
<?php foreach($categories as $cat) {
?>
<tr>
<td><?php echo $cat['categoryName'];?>
</td>
<form method="post" action="category_list.php">
<input type="hidden" name="deleteThis"
value="<?php echo $cat['categoryID']; ?> " />
<td></td>
<td><input type="submit" value="Delete" />
</td>
</form>
<?php
}
?>
</table>
<br />
<h2>Add a Movie</h2>
<!-- add code for the form here -->
<p>
Add Movie
</p>
<br />
<p>
Movie List
</p>
</div>
<!-- end main -->
<div id="footer">
<p>
©
<?php echo date("2012"); ?>
My Movie Store, created by Kara Holey
</p>
</div>
</div>
<!-- end page -->
</body>
</html>
My database name is called moviedatabase that i had created in localhost/phpmyadmin and my 2 tables underneath the database are called categories and movies. and for some reason thsi is the error that i get on this page.
Warning: Invalid argument supplied for foreach() in C:\xampp\htdocs\1306\finalp\index.php on line 82
If anyone can help me that would be great.
If you're using PDO, this probably means your query failed and the output of $db->query() is false.
To avoid this problem, I would suggest enabling exception handling:
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
You can add this to database.php. Doing this will produce a very obvious and hard-to-miss exception if a query fails with details as to why it failed.
$categories = $db->query($query) // this is your problem
I think your foreach() is not receiving a valid array. Try troubleshooting with a static array you create!!
example make
$categories = array("A","B");
foreach($categories as $value){
echo $value."<br/>";
}
Your variable $categories in foreach loop isn't a valid collection that's why php gives you this error. You need to see what $categories really is.
I doubt it might be a resource returned from your query or could be a null.