I am trying to create a dynamic tab with PHP and MySQL using the Bootstrap Framework.
I am wondering why the dynamic tab is squeezed together. In addition, when I click the tab, it does not change color to show that I clicked that tab.
Actual Result:
The tabs 'Now Showing' and 'Coming Soon' are squeezed together. The selected tab does not change color even when it is clicked.
Expected Result:
The tabs 'Now Showing' and 'Coming Soon' should not be squeezed together. When either of the tab is clicked, that particular tab should change color.
How do I solve this problem such that the tabs will not be squeezed together AND the tabs will change color when it is clicked (to differentiate it from the tabs that are not clicked ---> as shown in the Expected Result)
Here are my codes:
<?php
$servername = 'localhost';
$username = 'root';
$password = '';
$dbname = 'movie';
$conn = new mysqli($servername, $username, $password, $dbname);
$tab_query = "SELECT * FROM category ORDER BY Category_ID";
$tab_result = mysqli_query($conn, $tab_query);
$tab_menu = '';
$count = 0;
while ($row = mysqli_fetch_array($tab_result)) {
if ($count == 0) {
$tab_menu .= '<li class="active">' . $row["Category_Name"] . '</li>';
} else {
$tab_menu .= '<li>' . $row["Category_Name"] . '</li>';
}
$count++;
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Testing Movie Website</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="true">
<!--Bootstrap CSS-->
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity=
"sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!--Custom CSS-->
<link rel="stylesheet" href="css/main.css">
<!--jQuery-->
<script defer
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<!--Bootstrap JS-->
<script defer
src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"
integrity="sha384-6khuMg9gaYr5AxOqhkVIODVIvm9ynTT5J4V1cfthmT+emCG6yVmEZsRHdxlotUnm"
crossorigin="anonymous"></script>
<script defer src="js/main.js"></script>
</head>
<body>
<?php include "nav.inc.php"; ?>
<div class="container">
<br>
<ul class="nav nav-tabs">
<?php echo $tab_menu; ?>
</ul>
</div>
</body>
</html>
I followed this video: https://www.youtube.com/watch?v=qkmqncXTiLU
The structure and classes for .tabs is:
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link active" href="#">Active</a>
</li>
</ul>
Looks like you missed some classes.
The active class needs to go to <a> tag and the <li> tag needs a class nav-item. This will make it work. So it should essentially be:
<?php
while ($row = mysqli_fetch_array($tab_result)) {
if ($count == 0) {
$tab_menu .= '<li class="nav-item"><a class="nav-link active" href="#' . $row["Category_ID"] . '" data-toggle="tab">' . $row["Category_Name"] . '</a></li>';
} else {
$tab_menu .= '<li class="nav-item"><a class="nav-link" href="#' . $row["Category_ID"] . '" data-toggle="tab">' . $row["Category_Name"] . '</a></li>';
}
$count++;
}
Related
I have an "uploads" folder that according to the database with php and mysql shows some videos, the problem is that in localhost it works, but when I insert the files in the file manager of the host (000webhost), the host cannot recognize the path "uploads", this is full code, the problem is in the video src at the end of the code.
<?php
require_once("config.php");
$result=' ';
$cerca=$_POST["cerca"];
$sql = "SELECT * FROM artisti WHERE nome like '%".$cerca."%'";
$result = $conn->query($sql);
if ($result->num_rows > 0)
{
//echo "<h1>Artisti trovato</h1>";
while ($row = $result->fetch_assoc()) {
$ID=$row["ID"];
$nome=$row["nome"];
$link=$row["link"];
$album=$row["album"];
//echo "<h2>ID: "."$ID"."</h2>";
//echo "nome: "."$nome"."<br>";
}
}
else {
echo "nessun artista trovato";
$conn->close();
exit;
}
?>
<!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">
<title>Utopia-Playlist</title>
<!--Reset css per ogni broswer-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css" integrity="sha512-NmLkDIU1C/C88wi324HBc+S2kLhi08PN5GDeUVVVC/BVt/9Izdsc9SVeVfA1UZbY3sHUlDSyRXhCzHfr6hmPPw==" crossorigin="anonymous" />
<!--Script scroll-->
<script src="https://unpkg.com/scrollreveal#4.0.0/dist/scrollreveal.min.js"></script>
<!--Icone-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" />
<!--Icona tab di google-->
<link rel="icon" href="Fulmine viola bianco.png">
<link rel="stylesheet" href="hero.css">
<link rel="stylesheet" href="nav.css">
<link rel="stylesheet" href="playlist1.css">
<style>
#import url('https://fonts.googleapis.com/css2?family=Overpass&display=swap');
</style>
</head>
<body>
<!--NavBar-->
<header class="he">
<h1 class="developers">Utopia Playlist</h1>
<nav>
<div class="listanav">
<li class="icon">Home</li>
<li>Playlist <i class="fas fa-caret-down"></i>
<ul class="submenu">
<li>Consigli</li>
<li>
Consigli-DV
</li>
<li> Top 50</li>
</ul>
</li>
<li>Contattaci</li>
</div>
</div>
</nav>
<button type="button" class="accedi">Accedi</button>
</header>
<!--Hero--> <!-- class="btn" -->
<div class="hero">
<div class="hero-cn scroll">
<p class="intro-text">ASCOLTA I NOSTRI CONSIGLI!</p>
<?php echo "<h1 class=grande-text>"."$nome"."</h1>"?>
<?php echo "<a class=btn href=$album>Scopri di più</a>" ?>
</div>
<video autoplay muted loop class="vd">
<source src="uploads/<?php echo $link?>" type="video/mp4" >
</video>
</div>
maybe there are some that you should check again:
The $link variable hasn't gotten the value it got
Placement of folders is not the same right
Check the connection whether it is connected to the hosting database or not
I am trying to create a dynamic tab with PHP and MySQL using Bootstrap Framework for the movie website that I am creating. The movies will be segregated into Now Showing and Coming Soon.
Expected Result: The movies should be displayed based on the category (Now Showing or Coming Soon).
Actual Result: The dynamic tab is not working. Movies that are under “Coming Soon” are displayed in “Now Showing”. In addition, the website only displays 2nd record onwards (from the database). The first record for “Now Showing” which is theand “Coming Soon” are not displayed.
The same content is displayed regardless of clicking “Now Showing” or “Coming Soon” tab (The “Coming Soon” tab can only be seen if I hover which is another issue that I need to fix). The movie 'The cursed lesson' should be shown in Coming Soon. The first record for 'Now Showing' and 'Coming Soon' are not shown.
I truly appreciate your help and advice in fixing these problems. I have been trying to solve these for days but I just can't seem to figure it out.
Here are my codes:
<?php
$servername = 'localhost';
$username = 'root';
$password = '';
$dbname = 'movie';
$conn = new mysqli($servername, $username, $password, $dbname);
$tab_query = "SELECT * FROM category ORDER BY Category_ID";
$tab_result = mysqli_query($conn, $tab_query);
$tab_menu = '';
$tab_content = '';
$count = 0;
while ($row = mysqli_fetch_array($tab_result)) {
if ($count == 0) {
$tab_menu .= '<li class="nav-item"><a class="nav-link active" href="#' . $row["Category_ID"] . '" data-toggle="tab">' . $row["Category_Name"] . '</a></li>';
$tab_content .= '<div id="'.$row["Category_ID"].'" class="tab-pane fade in active"';
} else {
$tab_menu .= '<li class="nav-item"><a class="nav-link" href="#' . $row["Category_ID"] . '" data-toggle="tab">' . $row["Category_Name"] . '</a></li>';
$tab_content .= '<div id="'.$row["Category_ID"].'" class="tab-pane fade"';
}
$product_query = "SELECT * FROM movie WHERE Category_ID = '".$row["Category_ID"]."'";
$product_result = mysqli_query($conn, $product_query);
while($sub_row = mysqli_fetch_array($product_result))
{
$tab_content .= '
<div class="col-md-3" style="margin-bottom:36px;">
<img src="'.$sub_row["Image_URL"].'" class="img-responsive img-thumbnail" />
<h4>'.$sub_row["Title"].'</h4>
</div>
';
}
$tab_content .= '<div style="clear:both"></div></div>';
$count++;
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Movie Testing Website</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="true">
<!--Bootstrap CSS-->
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity=
"sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!--Custom CSS-->
<link rel="stylesheet" href="css/main.css">
<!--jQuery-->
<script defer
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<!--Bootstrap JS-->
<script defer
src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"
integrity="sha384-6khuMg9gaYr5AxOqhkVIODVIvm9ynTT5J4V1cfthmT+emCG6yVmEZsRHdxlotUnm"
crossorigin="anonymous"></script>
<script defer src="js/main.js"></script>
</head>
<body>
<div class="container">
<ul class="nav nav-tabs">
<?php echo $tab_menu; ?>
</ul>
<div class="tab-content">
<?php echo $tab_content; ?>
</div>
</div>
</body>
</html>
Here are snippets of my database:
Movie Table:
Category Table:
I was found the problem in the view and not in data collection from db.
I modified the html structure based on this sample: https://bootsnipp.com/snippets/exE6D
Find out more about Bootstrap tab navigations: https://www.w3schools.com/bootstrap4/bootstrap_navs.asp
<?php
$servername = 'localhost';
$username = 'root';
$password = '';
$dbname = 'movie';
$conn = new mysqli($servername, $username, $password, $dbname);
$tab_query = "SELECT * FROM category ORDER BY Category_ID";
$tab_result = mysqli_query($conn, $tab_query);
$tab_menu = '';
$tab_content = '';
$count = 0;
while ($row = mysqli_fetch_array($tab_result)) {
if ($count == 0) {
$tab_menu .= '<a class="nav-item nav-link active" id="' . $row["Category_ID"] . '" data-toggle="tab" href="#nav-' . $row["Category_ID"] . '" role="tab" aria-controls="nav-' . $row["Category_ID"] . '" aria-selected="true">' . $row["Category_Name"] . '</a>';
$tab_content .= '<div class="tab-pane fade show active" id="nav-' . $row["Category_ID"] . '" role="tabpanel" aria-labelledby="nav-' . $row["Category_ID"] . '-tab">';
} else {
$tab_menu .= '<a class="nav-item nav-link" id="' . $row["Category_ID"] . '" data-toggle="tab" href="#nav-' . $row["Category_ID"] . '" role="tab" aria-controls="nav-' . $row["Category_ID"] . '" aria-selected="false">' . $row["Category_Name"] . '</a>';
$tab_content .= '<div class="tab-pane fade show" id="nav-' . $row["Category_ID"] . '" role="tabpanel" aria-labelledby="nav-' . $row["Category_ID"] . '-tab">';
}
$product_query = "SELECT * FROM movie WHERE Category_ID = '".$row["Category_ID"]."'";
$product_result = mysqli_query($conn, $product_query);
while($sub_row = mysqli_fetch_array($product_result))
{
$tab_content .= '
<div class="col-md-3" style="margin-bottom:36px;">
<img src="'.$sub_row["Image_URL"].'" class="img-responsive img-thumbnail" />
<h4>'.$sub_row["Title"].'</h4>
</div>';
}
$tab_content .= '<div style="clear:both"></div></div>';
$count++;
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Movie Testing Website</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="true">
<!--Bootstrap CSS-->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!--Custom CSS-->
<link rel="stylesheet" href="css/main.css">
<!--jQuery-->
<script defer
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<!--Bootstrap JS-->
<script defer src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"
integrity="sha384-6khuMg9gaYr5AxOqhkVIODVIvm9ynTT5J4V1cfthmT+emCG6yVmEZsRHdxlotUnm"
crossorigin="anonymous"></script>
<script defer src="js/main.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-xs-12 ">
<nav>
<div class="nav nav-tabs nav-fill" id="nav-tab" role="tablist">
<?php echo $tab_menu; ?>
</div>
</nav>
<div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent">
<?php echo $tab_content; ?>
</div>
</div>
</div>
</div>
</body>
</html>
I am working on building a site, but right now it has several images that I don't have actual images for yet. As this site has thousands of images or places where images should be, I don't want to have to manually change each of them and then change them again when I find the correct image. Is there a way to create a function that will look for the missing images and replace them with a specified image until the correct image is found?
Update: Since I am still a bit confused as to where to even place this function, I am going to add the code for one of the pages that I need this for then maybe someone can help me figure out how to place it.
Here is the code for one of the pages:
<?php
require_once('dbconnection.php');
mysqli_select_db($conn, $dbname);
$query_master = "SELECT DISTINCT * FROM `master_list` INNER JOIN types_join ON master_list.join_id=types_join.join_id WHERE `type_id` = 171 ORDER BY `item_id`";
$master = mysqli_query($conn, $query_master) or die(mysqli_error());
$row_master = mysqli_fetch_assoc($master);
$totalrows_master = mysqli_num_rows($master);
?>
<!doctype html>
<html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flower Trees</title>
<link href="/css/styles.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" type="image/png" href="img/favicon.png">
</head>
<body>
<div class="wrapper">
<a id="top"></a>
<?php require_once('header.php'); ?>
<?php require_once('nav.php'); ?>
<div class="category"><h2>Flower Trees</h2></div>
<div class="display">
<?php do { ?>
<ul>
<li><a href="details.php?recordID=<?php echo $row_master['master_id']; ?>"><img class="thumb" src="img/<?php echo $row_master['img']; ?>"/>
<br />
<span class="name"><?php echo $row_master['name']; ?></span></a></li>
</ul>
<?php } while ($row_master = mysqli_fetch_assoc($master)); ?>
<!-- end .display --></div>
<?php
mysqli_free_result($master);
?>
<?php require_once('footer.php'); ?>
<!-- end .wrapper --></div>
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
</script>
</body>
</html>
Since this is as simple as a foreach loop, and not tons of images scattered across your webpage, you can use something like:
$image = file_exists('img/' . $row_master['img']) ? 'img/' . $row_master['img'] : 'placeholder.png';
Full code:
<?php
require_once('dbconnection.php');
mysqli_select_db($conn, $dbname);
$query_master = "SELECT DISTINCT * FROM `master_list` INNER JOIN types_join ON master_list.join_id=types_join.join_id WHERE `type_id` = 171 ORDER BY `item_id`";
$master = mysqli_query($conn, $query_master) or die(mysqli_error());
$row_master = mysqli_fetch_assoc($master);
$totalrows_master = mysqli_num_rows($master);
?>
<!doctype html>
<html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flower Trees</title>
<link href="/css/styles.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" type="image/png" href="img/favicon.png">
</head>
<body>
<div class="wrapper">
<a id="top"></a>
<?php require_once('header.php'); ?>
<?php require_once('nav.php'); ?>
<div class="category"><h2>Flower Trees</h2></div>
<div class="display">
<?php do {
$image = file_exists('img/' . $row_master['img']) ? 'img/' . $row_master['img'] : 'placeholder.png';
?>
<ul>
<li><a href="details.php?recordID=<?php echo $row_master['master_id']; ?>"><img class="thumb" src="<?php echo $image; ?>"/>
<br />
<span class="name"><?php echo $row_master['name']; ?></span></a></li>
</ul>
<?php } while ($row_master = mysqli_fetch_assoc($master)); ?>
<!-- end .display --></div>
<?php
mysqli_free_result($master);
?>
<?php require_once('footer.php'); ?>
<!-- end .wrapper --></div>
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
</script>
</body>
</html>
I don't want to have to manually change each of them and then change them again when I find the correct image. Is there a way to create a function that will look for the missing images and replace them with a specified image until the correct image is found?
Such a function might be written as:
function im($imgName) {
$pathToImgs = "images/";
if (file_exists( $pathToImgs . $imgName )) {
echo $pathToImgs . $imgName;
}
else {
echo $pathToImgs . "placeholder.jpg";
}
}
Then in your html:
<img src="<?php im("product1.jpg"); ?>">
<img src="<?php im("product2.jpg"); ?>">
<img src="<?php im("product3.jpg"); ?>">
As a start.
***Edit 1:
Given your code where it says:
<img class="thumb" src="img/<?php echo $row_master['img']; ?>"/>
You might modify it with a conditional that inserts the placeholder image in the event that the target image simply doesn't exist, yet.
<img class="thumb" src="<?php
if (file_exists("img/" . $row_master['img'])) {
echo "img/" . $row_master['img'];
}
else {
echo 'img/placeholder.jpg';
}
?>">
You could reuse this functionality by turning the conditional into a php function, so described as a starter above.
Using jQuery, you can accomplish something easy enough using a global $('img') handler when errors occur. Simply swap them out with your placeholder image afterwards.
$('img').on('error', function() {
const oldSrc = encodeURIComponent($(this).attr('src'));
$(this).attr('src', `https://via.placeholder.com/300/000000/FFFFFF/?text=${oldSrc}`);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img src="imagethatdoesntexist.jpg"><br />
<img src="anotherimage.jpg">
Here I use placeholder.com (A convenient site for placeholder images such as this), and inject the old image source into the query string, which the site will render in the image itself.
I'm making a website for school about MLB with a database. But now I want information in the database as an option in a dropdownlist. This is my HTML Code:
<!DOCTYPE html>
<html>
<head>
<link rel="icon" type="image/png" href="./images/favicon-32x32.png"
sizes="32x32" />
<link rel="icon" type="image/png" href="./images/favicon-16x16.png"
sizes="16x16" />
<title>MLB: Major League Baseball</title>
<link href="css folder/MLBstylesheet.css" rel="stylesheet"
type="text/css"/>
</head>
<body>
<div id="container">
<div id="titel">
<img class="MLBTitel" src="./images/MLBtitel.jpg" alt="MLBTitel" >
<div id="titeltekst">
MAJOR LEAGUE BASEBALL
<br>
</div>
<nav>
<ul>
<li><a class= "menu" href="index.html">Home</a></li>
<li><a class= "menu" href="spelers.php">Spelers</a></li>
<li><a id = "active" class= "menu" href="teams.php">Teams</a></li>
<li><a class= "menu" href="wedstrijden.html">Wedstrijden</a></li>
<li><a class= "menu" href="contact.html">Contact</a></li>
</ul>
</nav>
<br><br>
</div>
<div id="teamtabel">
<?php
$servername = "localhost";
$username = "id1419279_root";
$password = "*******";
$dbname = "id1419279_mlb";
// Create connection
$conn = new mysqli($localhost, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT * FROM teams";
$result = $conn->query($sql);
echo "<select name='naamteam'>";
while ($row = mysql_fetch_array($result)) {
echo "<option value='" . $row['teamnaam'] ."'>" . $row['teamnaam'] ."
</option>";
}
echo "</select>";
?>
</div>
</div>
</body>
</html>
The options would be the teamnames, but it seems like my dropdownlist is still empty: picture of the dropdownlist on the website
This is what my database looks like:
picture of my database
I hope someone could help me and I would really appreciate it.
<!DOCTYPE html>
<html>
<head>
<link rel="icon" type="image/png" href="./images/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="./images/favicon-16x16.png" sizes="16x16" />
<title>MLB: Major League Baseball</title>
<link href="css folder/MLBstylesheet.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="container">
<div id="titel">
<img class="MLBTitel" src="./images/MLBtitel.jpg" alt="MLBTitel" >
<div id="titeltekst">
MAJOR LEAGUE BASEBALL
<br>
</div>
<nav>
<ul>
<li><a class= "menu" href="index.html">Home</a></li>
<li><a class= "menu" href="spelers.php">Spelers</a></li>
<li><a id = "active" class= "menu" href="teams.php">Teams</a></li>
<li><a class= "menu" href="wedstrijden.html">Wedstrijden</a></li>
<li><a class= "menu" href="contact.html">Contact</a></li>
</ul>
</nav>
<br><br>
</div>
<div id="teamtabel">
<?php
$servername = "localhost";
$username = "id1419279_root";
$password = "*******";
$dbname = "id1419279_mlb";
// Create connection
$conn = new mysqli($localhost, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT * FROM teams";
$result = $conn->query($sql);
$dropdownlist = '';
while($row = mysqli_fetch_array($result)) {
$teamnaam = $row['teamnaam'];
$dropdownlist .="<option value='" . $teamnaam . "'>" . $teamnaam . "</option>";
}
if(isset($dropdownlist)){
echo "<select name='naamteam'>";
echo $dropdownlist;
echo "</select>";
}
?>
</div>
</div>
</body>
</html>
I'm making a script that i use my database to show the menu of a page. But i ran into a problem...
The script on my website. : Click here
Problem
So i have this code
UPDATED CODE AND ADDED LINK
<!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">
<meta name="description" content="">
<meta name="author" content="">
<title>Heroic Features - Start Bootstrap Template</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/heroic-features.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Start Bootstrap</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<?php
$db = new mysqli('xxxxxxxxxxx');
if($db->connect_errno > 0){
die('Unable to connect to database [' . $db->connect_error . ']');
}
if($_GET['action'] == '')
{
$sql = "SELECT * FROM li_psp";
if(!$result = $db->query($sql)){
die('There was an error running the query [' . $db->error . ']');
}
while($row = $result->fetch_assoc()){
echo " <li>
<a href='{$row['li_href']}'>{$row['li_label']}</a>
</li>";
}
}
?>
<?php
$db = new mysqli('xxxxxxxxxxx');
if($db->connect_errno > 0){
die('Unable to connect to database [' . $db->connect_error . ']');
}
if($_GET['action'] == '')
{
$sql = "SELECT * FROM ul_psp";
error_reporting(E_ALL);
if(!$result = $db->query($sql)){
die('There was an error running the query [' . $db->error . ']');
}
while($row = $result->fetch_assoc()){
echo "<li class='dropdown'>
<a href='#' class='dropdown-toggle' data-toggle='dropdown'>{$row['ul_name']} <b class='caret'></b></a>
<ul class='dropdown-menu'>";
if($_GET['action'] == '')
{
$sql = "SELECT * FROM ul_data_psp WHERE belong_to = {$row['ul_name']}";
if(!$result = $db->query($sql)){
die('There was an error running the query [' . $db->error . ']');
}
while($row = $result->fetch_assoc()){
echo " <li>
<a href='{$row['ul_data_href']}'>{$row['ul_data_label']}</a>
</li>";
echo "</ul>
</li>";
}
}
}
}
?>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
But for some reason it does not work. I get this error: Parse error: syntax error, unexpected '' (T_ENCAPSED_AND_WHITESPACE), expecting identifier (T_STRING) or variable (T_VARIABLE) or number (T_NUM_STRING) in /home/u799303375/public_html/beta/include/menu.php on line 98
What have i tried?
I tried changing all the " to ' but it didn't work, i need help fixing this code, if you have any other things i can do better please tell it! Thanks!
You have malformed quotationmarks. Put variables not directly into strings, concat them with a .:
echo '<li><a href=' . $row['ul_data_href'] . '>' . $row['ul_data_label'] . '</a></li>'