I want to print half of the table record in left accordion and remaining half record in right div. I am using the following code. I ahve two column in the table. In which i have record. Example if there are 4 records in the table than first two record should go on left accordion and next two records should go on right side accordion. I am using the following code.
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "data";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT id, price FROM demo";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
print_r($row);
}
} else {
echo "0 results";
}
$conn->close();
?>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
</head>
<body>
<div class="ordinary">
<div class="container">
<div class="row main-row">
<!--left-->
<div class="col-md-6">
<div class="col-inner left-col">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title left-title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel1"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel1" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-content">
1
</div>
</div>
</div>
</div>
</div>
</div>
<!--make it 50% -->
<div class="col-inner left-col">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title left-title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel2"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel2" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-content">
2
</div>
</div>
</div>
</div>
</div>
</div>
</div> <!-- left-col-md-6 ends here -->
<div class="col-md-6 ">
<div class="col-inner right-all">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel3"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel3" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-right">
3
</div>
</div>
</div>
</div>
</div>
</div>
<!-- accordian -->
<div class="col-inner right-all">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel4"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel4" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-right">
4
</div>
</div>
</div>
</div>
</div>
</div>
<br/>
</div> <!-- right-col-md-6 ends here -->
</div>
</div>
</div>
<script type="text/javascript">
var selectIds =$('#panel1,#panel2,#panel3,#panel4');
$(function ($) {
selectIds.on('hidden.bs.collapse show.bs.collapse', function () {
$(this).prev().find('.glyphicon').toggleClass('glyphicon-plus glyphicon-minus');
})
});
</script>
</body>
Try this:
<?php
while($row = fetch_row($result)){
$rows[]=$row;
}
?>
Inside left accordion
<?php
for($i=0;$i < count($rows)/2;$i++){
echo $row[$i]['id']; //or whatever you want
}
?>
Inside right accordion
<?php
for($i=count($rows)/2;$i < count($rows); $i++){
echo $row[$i]['id']; //or whatever you want
}
?>
Related
I'm trying to update data from mysql database use php.
I can get all data from db into table, then I click edit and I can get the data, but when I edit the form and click the submit button it's always said that the field is empty. Or sometimes it's edited into "blank row" on mysql db
heres the code:
ktgr_soal.php
<?php
include('../koneksi/koneksi.php');
if ((isset($_GET['aksi'])) && (isset($_GET['data']))) {
if ($_GET['aksi'] == 'hapus') {
$kode_ktgr = $_GET['data'];
//hapus data
$sql_ktgr = "delete from `kategori_soal`
where `id_kategori` = '$kode_ktgr'";
mysqli_query($koneksi, $sql_ktgr);
}
}
?>
<head>
<?php include("includes/head.php") ?>
</head>
<body>
<!-- S I D E B A R -->
<?php include("includes/sidebar.php") ?>
<!-- ENDS I D E B A R -->
<?php include("includes/header.php") ?>
<div class="content-wrap">
<div class="main">
<div class="container-fluid">
<div class="row">
<div class="col-lg-8 p-r-0 title-margin-right">
<div class="page-header">
<div class="page-title">
<h1>Data Kategori Soal</h1>
</div>
</div>
</div>
<!-- /# column -->
<div class="col-lg-4 p-l-0 title-margin-left">
<div class="page-header">
<div class="page-title">
<ol class="breadcrumb">
<li class="breadcrumb-item">Dashboard</li>
<li class="breadcrumb-item active">Kategori Soal</li>
</ol>
</div>
</div>
</div>
<!-- /# column -->
</div>
<!-- /# row -->
<!-- M A I N C O N T E N T -->
<section id="main-content">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-title">
<a href="add_kategori.php">
<button type="button" class="btn btn-primary btn-flat btn-addon m-b-10 m-l-5 float-right"><i class="ti-plus"></i>Tambah Data</button>
</a>
<!-- Search form -->
<form class="form-inline d-flex md-form form-sm">
<input class="form-control form-control-sm mr-3 w-25" type="text" placeholder="Search" aria-label="Search">
<i class="ti-search" aria-hidden="true"></i>
</form>
</div>
<div class="card-body">
<div class="col-sm-12">
<?php if (!empty($_GET['notif'])) { ?>
<?php if ($_GET['notif'] == "tambahberhasil") { ?>
<div class="alert alert-success" role="alert">
Data Berhasil Ditambahkan</div>
<?php } else if ($_GET['notif'] == "editberhasil") { ?>
<div class="alert alert-success" role="alert">
Data Berhasil Diubah</div>
<?php } ?>
<?php } ?>
</div>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>No</th>
<th>Kategori Soal</th>
<th></th>
</tr>
</thead>
<tbody>
<?php
$batas = 10;
if (!isset($_GET['halaman'])) {
$posisi = 0;
$halaman = 1;
} else {
$halaman = $_GET['halaman'];
$posisi = ($halaman - 1) * $batas;
}
?>
<?php include('../koneksi/koneksi.php') ?>
<?php
//menampilkan data hobi
$sql_ktgr = "SELECT * FROM `kategori_soal` ";
if (isset($_GET["katakunci"])) {
$katakunci_jurusan = $_GET["katakunci"];
$sql_ktgr .= " where `kategori` LIKE '%$katakunci_jurusan%'";
}
$sql_ktgr .= " order by `kategori` limit $posisi, $batas ";
$query_ktgr = mysqli_query($koneksi, $sql_ktgr);
$no = $posisi + 1;
while ($data_ktgr = mysqli_fetch_row($query_ktgr)) {
$kode_ktgr = $data_ktgr[0];
$kategori = $data_ktgr[1];
?>
<tr>
<th scope="row"><?php echo $no; ?></th>
<td><?php echo $kategori; ?></td>
<td>
<a href="edit_kategori.php?data=<?php echo $kode_ktgr; ?>">
<button type="button" class="btn btn-warning btn-sm m-b-10 m-l-5 "><i class="ti-pencil-alt"></i></button>
</a>
<a href="javascript:if(confirm('Anda yakin ingin menghapus data <?php echo $kategori; ?>?'))
window.location.href = 'ktgr_soal.php?aksi=hapus&data=<?php echo $kode_ktgr; ?>'" class="btn btn-danger btn-sm m-b-10 m-l-5"><i class="ti-trash"></i>
</a>
</td>
</tr>
<?php
$no++;
} ?>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- /# column -->
<!-- FOOTER -->
<?php include("includes/footer.php") ?>
</section>
</div>
</div>
</div>
<!-- script -->
<?php include("includes/script.php") ?>
</body>
</html>
edit_kategori.php
<?php
session_start();
include('../koneksi/koneksi.php');
if (isset($_GET['data'])) {
$kode_kat = $_GET['data'];
$_SESSION['kode_ktgr'] = $kode_kat;
//get data kategori soal
$sql_d = "select `kategori` from `kategori_soal` where `id_kategori` = '$kode_kat'";
$query_d = mysqli_query($koneksi, $sql_d);
while ($data_d = mysqli_fetch_row($query_d)) {
$kategori = $data_d[0];
}
}
?>
<head>
<?php include("includes/head.php") ?>
</head>
<body>
<!-- S I D E B A R -->
<?php include("includes/sidebar.php") ?>
<!-- ENDS I D E B A R -->
<?php include("includes/header.php") ?>
<div class="content-wrap">
<div class="main">
<div class="container-fluid">
<div class="row">
<div class="col-lg-8 p-r-0 title-margin-right">
<div class="page-header">
<div class="page-title">
<h1>Edit Kategori Soal</h1>
</div>
</div>
</div>
<!-- /# column -->
<div class="col-lg-4 p-l-0 title-margin-left">
<div class="page-header">
<div class="page-title">
<ol class="breadcrumb">
<li class="breadcrumb-item">Dashboard</li>
<li class="breadcrumb-item active">Home</li>
</ol>
</div>
</div>
</div>
<!-- /# column -->
</div>
<!-- /# row -->
<!-- M A I N C O N T E N T -->
<section id="main-content">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-title">
<h3>Edit Kategori Soal </h3>
</div>
<div class="card-body">
<div class="basic-form">
<?php
if (!empty($_GET['notif'])) {
if ($_GET['notif'] == "editkosong") {
?>
<div class="alert alert-danger" role="alert">Maaf data wajib di isi</div>
<?php
}
}
?>
<form action="konf_edit_ktgr.php" action="post">
<div class="form-group">
<label for="kategori">Kategori</label>
<input type="text" id="kategori" name="kategori" class="form-control input-focus" value="<?php echo $kategori; ?>">
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- /# column -->
<!-- FOOTER -->
<?php include("includes/footer.php") ?>
</section>
</div>
</div>
</div>
<!-- script -->
<?php include("includes/script.php") ?>
</body>
</html>
konf_edit_ktgr.php
<?php
session_start();
include('../koneksi/koneksi.php');
if (isset($_SESSION['kode_ktgr'])) {
$kode_kat = $_SESSION['kode_ktgr'];
$kategori = $_POST['kategori'];
if (empty($kategori)) {
header("Location:edit_kategori.php?data=" . $kode_kat . "¬if=editkosong");
} else {
$sql = "update `kategori_soal` set `kategori` = '$kategori' where `id_kategori` = '$kode_kat'";
mysqli_query($koneksi, $sql);
header("Location:ktgr_soal.php?notif=editberhasil");
}
}
try to check again "$kode_kat" which is in the file "konf_edit_ktgr.php" whether you have got the value or not. If not, insert "$kode_kat" in the Edit form like this:
<form action="konf_edit_ktgr.php" action="post">
<div class="form-group">
<label for="kategori">Kategori</label>
<input type="text" id="kategori" name="kategori" class="form-control input-focus" value="<?php echo $kategori; ?>">
</div>
<input type="hidden" name="id" value="<?php echo $kode_kat; ?>">
<button type="submit" class="btn btn-primary">Submit</button>
</form>
Following is my code I am displaying details as 3 columns per row using Bootstrap class row.
I tried like changing div and some condition
<div class="container">
<?php
if($lclResult->rowCount() > 0){
while($row = $lclResult->fetch(PDO::FETCH_ASSOC)) {
# code...
$lclUserName = $row['us_business_name'];
$lclImage1 = $row['us_image1'];
$lclCategory = $row['us_category'];
$lclArea = $row['us_area'];
?>
<div class="row">
<div class="col-sm-4">
<div class="card">
<img class="card-img-top " src="<?php echo $lclImage1 ?>" alt="Card image" style="width:100%; height: 158px;">
<div class="card-body">
<h4 class="card-title"><?php echo $lclUserName?></h4>
<p class="card-text" style="font-size: 25px;"><?php echo $lclCategory?></p>
<hr>
<i class="fa fa-map-marker" style="font-size: 23px;"><span> </span><?php echo $lclArea?></i>
<!-- See Profile -->
</div>
</div>
<?php
}
?>
</div>
<?php
} else {
?>
<div class="container">
<div class="row">
<div class="col-sm-12">
<h1> NO RESULT FOUND...</h1>
</div>
</div>
</div>
<?php
}
?>
</div>
</div>
I want to display 3 columns per row to display data. If anyone knows Please guide me with the above code.
Change your code like this
<div class="container">
<div class="row">
<?php
if($lclResult->rowCount() > 0){
while($row = $lclResult->fetch(PDO::FETCH_ASSOC)) {
# code...
$lclUserName = $row['us_business_name'];
$lclImage1 = $row['us_image1'];
$lclCategory = $row['us_category'];
$lclArea = $row['us_area'];
?>
<div class="col-sm-4">
<div class="card">
<img class="card-img-top " src="<?php echo $lclImage1 ?>" alt="Card image" style="width:100%; height: 158px;">
<div class="card-body">
<h4 class="card-title">
<?php echo $lclUserName?>
</h4>
<p class="card-text" style="font-size: 25px;">
<?php echo $lclCategory?>
</p>
<hr>
<i class="fa fa-map-marker" style="font-size: 23px;">
<span>
</span>
<?php echo $lclArea?>
</i>
<!-- See Profile -->
</div>
</div>
</div>
<?php
}
?>
<?php
} else {
?>
<div class="container">
<div class="row">
<div class="col-sm-12">
<h1> NO RESULT FOUND...
</h1>
</div>
</div>
</div>
<?php
}
?>
</div>
</div>
I am building a simple blogging application in php and html, and when i generate my modals (using the javascript fetch() command) with database data, the modal trigger does not work. Here is the generation code:
Javascript:
function RetrieveArticles() {
fetch('blog-php/inc/blogOverview/retrieveArticles.php').then(response => response.text()).then(data => {
document.getElementById('container-articles').innerHTML = data;
})
}
Php:
require('../../settings.php');
try{
/* Create a new PDO object */
$connect = new PDO("mysql:host=$databaseHost;dbname=$databaseName",
$databaseUser, $databasePassword);
/* set the PDO error mode to exception */
$connect->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch(PDOException $e){
/* Redirect the user with errorcode 1: "Database settings are incorrect" */
header('location: ../pages/error.php?errcode=1');
exit();
}
$stmnt = $connect->prepare("SELECT * FROM blog_articles NATURAL JOIN article_text;");
$stmnt->execute();
$result = $stmnt->fetchAll(PDO::FETCH_ASSOC);
if(count($result) > 0){
foreach($result as $data){
echo "<div class='row'>";
echo "<div class='collection container-collection'>";
echo "<a class='blog-clicker modal-trigger' href='#$data[article_id]'>";
echo "<p>"."<span class='article-title'>".$data['article_name']."</span>"."<br/>"."By ".$data['article_user'].", ".$data['article_made']."</p>";
echo "</a>";
echo "</div>";
echo "</div>";
echo "<div id='$data[article_id]' class='modal'>";
echo "<div class='modal-content'>";
echo "<h5>".$data['article_name']."</h5>";
echo "<p>".$data['article_text']."</p>";
echo "</div>";
echo "<div class='modal-footer'>";
echo "<div class='divider'></div>";
echo "<button type='button' class='modal-close btn left indigo darken-3'>"."Close Article"."</button>";
echo "</div>";
echo "</div>";
}
}else{
echo "<p class='center-align'>"."No Articles Found"."</p>";
}
And this is how i gets displayed in the webbrowser:
<div id="blog-wrapper">
<div class="c-12" id="container-articles">
<div class="row">
<div class="collection container-collection">
<a class="blog-clicker modal-trigger" href="#art1527884499GuylianWasHier">
<p><span class="article-title">Test Modal 1</span><br>By GuylianWasHier, 2018-06-01 20:21:39</p>
</a>
</div>
</div>
<div id="art1527884499GuylianWasHier" class="modal">
<div class="modal-content">
<h5>Test Modal 1</h5>
<p>This is a simple modal test</p>
</div>
<div class="modal-footer">
<div class="divider"></div><button type="button" class="modal-close btn left indigo darken-3">Close Article</button></div>
</div>
<div class="row">
<div class="collection container-collection">
<a class="blog-clicker modal-trigger" href="#art1527884802GuylianWasHier">
<p><span class="article-title">12</span><br>By GuylianWasHier, 2018-06-01 20:26:42</p>
</a>
</div>
</div>
<div id="art1527884802GuylianWasHier" class="modal">
<div class="modal-content">
<h5>12</h5>
<p>12</p>
</div>
<div class="modal-footer">
<div class="divider"></div><button type="button" class="modal-close btn left indigo darken-3">Close Article</button></div>
</div>
<div class="row">
<div class="collection container-collection">
<a class="blog-clicker modal-trigger" href="#art1527884806GuylianWasHier">
<p><span class="article-title">1234</span><br>By GuylianWasHier, 2018-06-01 20:26:46</p>
</a>
</div>
</div>
<div id="art1527884806GuylianWasHier" class="modal">
<div class="modal-content">
<h5>1234</h5>
<p>1243</p>
</div>
<div class="modal-footer">
<div class="divider"></div><button type="button" class="modal-close btn left indigo darken-3">Close Article</button></div>
</div>
<div class="row">
<div class="collection container-collection">
<a class="blog-clicker modal-trigger" href="#art1527885314GuylianWasHier">
<p><span class="article-title">23</span><br>By GuylianWasHier, 2018-06-01 20:35:14</p>
</a>
</div>
</div>
<div id="art1527885314GuylianWasHier" class="modal">
<div class="modal-content">
<h5>23</h5>
<p>23</p>
</div>
<div class="modal-footer">
<div class="divider"></div><button type="button" class="modal-close btn left indigo darken-3">Close Article</button></div>
</div>
</div>
<div class="row">
<!-- Form -->
<div class="collection container-collection">
<a class="modal-trigger blog-clicker" href="#createnewarticle">
<p id="title-createnewarticle">Create New Article</p>
</a>
</div>
</div>
The modals get initialized by a script that has the auto-init function from materialize in it (Which loads correctly into the webpage because a modal that has not been generated by php works fine).
Does anyone know how to fix this?.
If you want to have a better look at the code, here is the github repo: https://github.com/GuylianWasHier/Blog.php
You have to reinitialize modals after document.getElementById('container-articles').innerHTML = data;
Try this
function RetrieveArticles() {
fetch('blog-php/inc/blogOverview/retrieveArticles.php').then(response => response.text()).then(data => {
document.getElementById('container-articles').innerHTML = data;
// you can destroy previous instances instance.destroy();
var elems = document.querySelectorAll('.modal');
var instances = M.Modal.init(elems, {});
})
}
So im building a fast food website i have built most of it apart from displaying the menu this will be different for each take away which is signed up. I have worked out that im gonna have categories and items so the take away can have a categories called "trays" then 5 items inside that categories with all the different trays they do then they can make another categorie for another block of food and so on. Problem i have is i will need to print out the categories and the items. I have 1 table called categories then another called topics the items will be stored in the topic table and categories in categories so would need to display it like so
categorie
topic
topic
topic
over and over.
Here is my html
<div class="menu-widget" id="2">
<div class="widget-heading">
<h3 class="widget-title text-dark">
POPULAR ORDERS Delicious hot food!
<a class="btn btn-link pull-right" data-toggle="collapse" href="#popular2" aria-expanded="true">
<i class="fa fa-angle-right pull-right"></i>
<i class="fa fa-angle-down pull-right"></i>
</a>
</h3>
<div class="clearfix"></div>
</div>
<div class="collapse in" id="popular2">
<div class="food-item">
<div class="row">
<div class="col-xs-12 col-sm-12 col-lg-8">
<div class="rest-logo pull-left">
<a class="restaurant-logo pull-left" href="#"><img src="http://placehold.it/100x80" alt="Food logo"></a>
</div>
<!-- end:Logo -->
<?php echo "food inside";?>
<div class="rest-descr">
<h6>Veg Extravaganza</h6>
<p> Burgers, American, Sandwiches, Fast Food, BBQ</p>
</div>
<!-- end:Description -->
</div>
<!-- end:col -->
<div class="col-xs-12 col-sm-12 col-lg-4 pull-right item-cart-info"> <span class="price pull-left">$ 19.99</span> + </div>
</div>
<!-- end:row -->
</div>
<!-- end:Food item --><!-- end:Food item --><!-- end:Food item -->
<div class="food-item white"><!-- end:row -->
</div>
<!-- end:Food item -->
</div>
<!-- end:Collapse -->
</div>
<!-- end:Widget menu -->
and here is my code
<div class="col-xs-12 col-sm-8 col-md-8 col-lg-6"><!-- end:Widget menu -->
<?php
///first select the category based on $_GET['cat_id']
$sql = "SELECT * FROM categories WHERE takeawayid =' ".$id1."'";
$result = mysql_query($sql);
if(!$result)
{
echo 'The category could not be displayed, please try again later.' . mysql_error();
}
else
{
if(mysql_num_rows($result) == 0)
{
echo 'This category does not exist.';
}
else
{
//display category data
while($row = mysql_fetch_assoc($result))
{
?>
<div class="menu-widget" id="2">
<div class="widget-heading">
<h3 class="widget-title text-dark">
<?php echo $row['cat_name'] ; ?> <a class="btn btn-link pull-right" data-toggle="collapse" href="#popular2" aria-expanded="true">
<i class="fa fa-angle-right pull-right"></i>
<i class="fa fa-angle-down pull-right"></i>
</a>
</h3>
<div class="clearfix"></div>
<?php
//do a query for the topics
$sql2 = "SELECT * FROM topics WHERE topic_cat =' ".$row['cat_id']."'";
$result2 = mysql_query($sql2);
}
echo $row2['topic_subject'] ;
if(!$result2)
{
echo 'The topics could not be displayed, please try again later.';
}
else
{
if(mysql_num_rows($result2) == 0)
{
echo 'There are no topics in this category yet.';
}
else
{
//prepare the table
while($row2 = mysql_fetch_assoc($result2))
{
?>
<div class="collapse in" id="popular2">
<div class="food-item">
<div class="row">
<div class="col-xs-12 col-sm-12 col-lg-8">
<div class="rest-logo pull-left">
<a class="restaurant-logo pull-left" href="#"><img src="http://sdfsdf.com/beta/restaurants/<?php echo $id33 ;?>.png" alt="Food logo"></a>
</div>
<!-- end:Logo -->
<div class="rest-descr">
<h6><?php echo $row2['topic_subject'] ;?></h6>
<p> Burgers, American, Sandwiches, Fast Food, BBQ</p>
</div>
<!-- end:Description -->
</div>
<!-- end:col -->
<div class="col-xs-12 col-sm-12 col-lg-4 pull-right item-cart-info"> <span class="price pull-left">$ 19.99</span> + </div>
</div>
<!-- end:row -->
</div>
<!-- end:Food item --><!-- end:Food item --><!-- end:Food item -->
<div class="food-item white"><!-- end:row -->
</div>
<!-- end:Food item -->
</div>
<!-- end:Collapse -->
</div>
</div>
<?php
}
}
}
}
}
?>
<!-- end:Widget menu -->
Code works but when i add more than 1 result im getting this
http://prntscr.com/fu3qll
Here is 1 cat and 2 topics in side it
https://prnt.sc/fu3g2j
works great but when i add 2 cats and 4 topics 2 inside each one i get above the fu3kbk link
so i fixed it by moving the bracket down on
$result2 = mysql_query($sql2);
<div class="col-xs-12 col-sm-8 col-md-8 col-lg-6"><!-- end:Widget menu -->
<?php
///first select the category based on $_GET['cat_id']
$sql = "SELECT * FROM categories WHERE takeawayid =' ".$id1."'";
$result = mysql_query($sql);
if(!$result)
{
echo 'The category could not be displayed, please try again later.' . mysql_error();
}
else
{
if(mysql_num_rows($result) == 0)
{
echo 'This category does not exist.';
}
else
{
//display category data
while($row = mysql_fetch_assoc($result))
{
?>
<div class="menu-widget" id="2">
<div class="widget-heading">
<h3 class="widget-title text-dark">
<?php echo $row['cat_name'] ; ?> <a class="btn btn-link pull-right" data-toggle="collapse" href="#popular2" aria-expanded="true">
<i class="fa fa-angle-right pull-right"></i>
<i class="fa fa-angle-down pull-right"></i>
</a>
</h3>
<div class="clearfix"></div>
</div>
<?php
//do a query for the topics
$sql2 = "SELECT * FROM topics WHERE topic_cat =' ".$row['cat_id']."'";
$result2 = mysql_query($sql2);
if(!$result2)
{
echo 'The topics could not be displayed, please try again later.';
}
else
{
if(mysql_num_rows($result2) == 0)
{
echo 'There are no topics in this category yet.';
}
else
{
//prepare the table
while($row2 = mysql_fetch_assoc($result2))
{
?>
<div class="collapse in" id="popular2">
<div class="food-item">
<div class="row">
<div class="col-xs-12 col-sm-12 col-lg-8">
<div class="rest-logo pull-left">
<a class="restaurant-logo pull-left" href="#"><img src="http://geatzo.com/beta/restaurants/<?php echo $id33 ;?>.png" alt="Food logo"></a>
</div>
<!-- end:Logo -->
<div class="rest-descr">
<h6><?php echo $row2['topic_subject'] ;?></h6>
<p> Burgers, American, Sandwiches, Fast Food, BBQ</p>
</div>
<!-- end:Description -->
</div>
<!-- end:col -->
<div class="col-xs-12 col-sm-12 col-lg-4 pull-right item-cart-info"> <span class="price pull-left">$ 0</span> + </div>
</div>
<!-- end:row -->
</div>
<!-- end:Food item --><!-- end:Food item --><!-- end:Food item -->
<!-- end:Food item -->
</div>
<!-- end:Collapse -->
<?php
}
}
}
}
}
}
?>
</div>
</div>
<!-- end:Widget menu -->
it might be a stupid question but i struggle with finding the source of my problem.I have a white space from no where, pages are saved as utf-8 and my php/html adds some double quotes that generates me white space. If someone can help me with this i would be glad:)
Here is the img
The problem is between col-md-8 and cold-md-4.First function si the left content, second is the right side.
code: 1st function
function arata()
{
global $dbh;
echo'
<div class="container">
<div class="row">
<div class="col-md-8">
<div id="cale"> Acasă <img src="images/sageata.jpg"><span> Sesiuni de instruire </span> </div>
<div id="title_page"><h2>Sesiuni de instruire</h2></div>
<div id="continut">
<div class="box box-solid">
<div class="box-body">
<div class="box-group" id="accordion">
<!-- we are adding the .panel class so bootstrap.js collapse plugin detects it -->
';
$stmt = $dbh->prepare("SELECT * FROM Sesiune order by ID_Sesiune desc");
$stmt->execute();
while ($row = $stmt->fetch())
{
$id_sesiune=$row['ID_Sesiune'];
$titlu=$row['Titlu'];
$desc=$row['Descriere'];
echo' <div class="panel box box-primary">
<div class="box-header">
<h4 class="box-title">
<a data-toggle="collapse" data-parent="#accordion" href="#'.$id_sesiune.'">
'.$titlu.'
</a>
</h4>
</div>
<div id="'.$id_sesiune.'" class="panel-collapse collapse">
<div class="box-body">
'.$desc.'
</div>
</div>
</div>';
}
echo' </div>
</div><!-- /.box-body -->
</div><!-- /.box -->
</div></div>';
}
code: 2nd function
function Stiri()
{
global $dbh;
echo'
<div class="col-md-4">
<div id="inscrie"><button type="button" class="btn2 btn-primary2" data-toggle="button">Click aici pentru înscriere<span class="glyphicon glyphicon-chevron-right"></span></button></div>
<div id="search">
<div class="input-group">
<form method="GET" class="cauta" action="cautare.php">
<input type="text" class="form-control" name="cautare" placeholder="Caută în site ...">
<span class="input-group-btn">
<button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span></button>
</span>
</form>
</div></div>
<div id="noutati">
<h2>Noutăţi</h2>
<ul>';
$stmt = $dbh->prepare("SELECT * FROM Noutati order by Data desc limit 7");
$stmt->execute();
while ($row = $stmt->fetch())
{
echo '<li>'.$row['Titlu'].'</li>';
}
echo'</ul>
<div id="toate"><button type="button" class="btn3 btn-primary3">Toate noutăţile</button></div>
</div>
</div>
</div>
</div>';
}
───→</div>↲
───→<div class="col-md-4">...
With ↲ being a new line, and ───→ being a tab. You have space! The "quotes" you see are the DOM inspector saying "here's a text node", they're not in the source. All that's in your source, is the whitespace that you put there.
Try:
</div><div class="col-md-4">...