I returning my data to build a list group. All is fine but when the data contains <pre> tag it messes my display.
My list group as follows.
if (isset($BS_array)){
//Create a list group to show results
echo '<div class="list-group">';
foreach($BS_array as $result){
?>
<!-- Build list group -->
<div class="list-group-item list-group-item-action" aria-current="true">
<div class="d-flex w-100 justify-content-between">
<!-- Incident number goes here -->
<h5 style="cursor: pointer;" id="<?php echo $result['number']; ?>" onclick="getINCDetails(this.id)" class="mb-1"><?php echo $result['number']; ?></h5>
</div>
<!-- Description goes here -->
<p class="mb-1"><?php echo $result['description']; ?></p>
<small>
<?php
//List BS in INC card
echo $result['state'];
?>
</small>
</div>
<?php
}
echo '</div>';
}
?>
The way when all goes ok should be like this.
But at times, $result['description'], contains the word <pre>, which messes things up.
It will look like this.
How do I fix/circumvent this problem?
If you dont require html tags to actually work on the description just use htmlentities():
<?php echo htmlentities($result['description']); ?>
That will actually show instead of the browser considering it html tag.
I am using post navigation for my blog. For this portion i wrote some css. It's working fine. But the problem is for the very latest post , it's showing blank space for next post link. Same thing is happened with oldest post, it's showing again bank space for previous post link.
I add code snippet for this portion. Can i anyone suggest how can i modify my css for this portion. Following code is embedded in php file.
<div class="row justify-content-center">
<div class="sewl-more-posts">
<div class="previous-post">
<?php If(previous_post_link()){?>
<span class="post-control-link">Previous Article</span>
<span class="post-name"><?php previous_post_link(); ?></span>
<?php } ?>
</div>
<div class="next-post">
<?php If(next_post_link()){?>
<span class="post-control-link">Next Article</span>
<span class="post-name"><?php next_post_link(); ?></span>
<?php } ?>
</div>
</div>
</div>
First, output the divs only if they'll have content:
<div class="sewl-more-posts">
<?php if (previous_post_link()){?>
<div class="previous-post">
<span class="post-control-link">Previous Article</span>
<span class="post-name"><?php previous_post_link(); ?></span>
</div>
<?php } ?>
<?php if (next_post_link()){?>
<div class="next-post">
<span class="post-control-link">Next Article</span>
<span class="post-name"><?php next_post_link(); ?></span>
</div>
<?php } ?>
</div>
This way, if the previous-post or next-post div is missing, you'll be able to target the remaining one with the :only-child pseudo class:
.sewl-more-posts > div:only-child {
text-align: center;
}
You cannot do this with php once the page is generated client-side, therefore you have to use javascript (for example):
onclick = documet.getElementById('the id you have').style.property = "blue";
So, I have a php file called db.php to replicate some sort of database. This is basically a file with some multidimensional associative arrays:
<?php
$arrShowcases = array(
"1"=>array("title"=>"Landing Page", "descr"=>"Welcome!", "img"=>"actions-landing.jpg", "polygon"=>array(
0=> array(
"points"=>"1338,4,1338,50,1272,50,1272,4",
"link"=>"69",
"modalbody"=>"This button lets you Signup on the webapp",
"modaltitle"=>"Signup Button"
),
1=> array(
"points"=>"1246,12,1249,44,1206,44,1204,14",
"link"=>"2",
"modalbody"=>"This button redirects you for the login form",
"modaltitle"=>"Login Button"
)
)),
"2"=>array("title"=>"Login page", "descr"=>"Make your login", "img"=>"actions-login.jpg", "polygon"=>array(
0=> array(
"points"=>"1338,4,1338,50,1272,50,1272,4",
"link"=>"69",
"modalbody"=>"This button lets you Signup on the webapp",
"modaltitle"=>"Signup Button"
),
1=> array(
"points"=>"1246,12,1249,44,1206,44,1204,14",
"link"=>"69",
"modalbody"=>"This button redirects you for your dashboard",
"modaltitle"=>"Login Button"
)
))
);
?>
Then, I have a html page with a section element where I need to change page header title, subtitle, image and some polygon points:
<section>
<div class="container">
<div class="row">
<div class="col-md-3">
<?php include cfgPath."/includes/menu.html"; ?>
</div>
<div class="col-md-9">
<h1 class="page-header"><i class="glyphicon glyphicon-picture"></i> Landing page</h1>
<h3>// Lorem ipsum...</h3>
<div class="col-md-12">
<div style="position:relative;">
<img id="pageScreenshot" src="<?php echo cfgRoot; ?>/assets/images/actions-landing.jpg" class="img-responsive" alt="Landing Page"/>
<svg id="svgImageMap" width="1366" height="768">
<polygon points="1338,4,1338,50,1272,50,1272,4" data-originalpoints="1338,4 1338,50 1272,50 1272,4" data-id="0"/>
<polygon points="1246,12,1249,44,1206,44,1204,14" data-originalpoints="1246,12 1249,44 1206,44 1204,14" data-id="1"/>
<polygon points="378,43,446,42,445,11,377,9" data-originalpoints="378,43 446,42 445,11 377,9" data-id="2"/>
<polygon points="196,10,367,10,366,42,195,43" data-originalpoints="196,10 367,10 366,42 195,43" data-id="3"/>
<polygon points="121,16,120,35,164,39,164,17" data-originalpoints="121,16 120,35 164,39 164,17" data-id="4"/>
<polygon points="14,15,13,40,95,43,95,12" data-originalpoints="14,15 13,40 95,43 95,12" data-id="5">
</svg>
</div>
<!-- data original points: X1,Y1 X2,Y2 X3,Y3 X4,Y4 -->
</br>
<a class="btn btn-success btn-sm btn-block" href="<?php echo cfgRoot; ?>/app/showcase/showcaseView.php">Go Back</a>
</div> <!-- colmd12 -->
</div> <!-- colmd9 -->
</div> <!-- row -->
</div> <!-- container -->
</section> <!-- section -->
As you can see on the above html for the section element, I wrote by hand all the information. However, my goal is to change that info with stuff provided from the db.php file.
I want something like this nameofthepage.php?id=1 (and all the info provided in the position 1 of the array goes to the html) or this: nameofthepage.php?id=2 (and all the info provided in the position 2 of the array goes to the html). Any advice or tip to get this behavior?
So far, I tried to do echos like this:
<?php echo $arrShowcases[positions-that-i-want]["information-that-i-want"]; ?>
to change the hardcoded html but that doesn't get me the dynamic behavior I need.
I hope you'll get the point.
<?php
//-----------------------------
// If id is not sent then stop with page execution. You can redirect or something else.
if(!isset($_GET["id"])) {
die("ID not received.");
}
// Get that received id because at this point we are sure that id is received because page execution did not stopped before.
$id = $_GET["id"];
//-----------------------------
// Import your "database".
require_once "db.php";
//-----------------------------
// If there is no page with that id, stop page execution.
if(!isset($arrShowcases[$id])) {
die("page does not exists.");
}
// If there is a page then store it in a variable.
$page = $arrShowcases[$id];
//-----------------------------
?>
<section>
<div class="container">
<div class="row">
<div class="col-md-3">
<?php include cfgPath."/includes/menu.html"; ?>
</div>
<div class="col-md-9">
<h1 class="page-header">
<i class="glyphicon glyphicon-picture"></i>
<?= $page['title']; ?> // Echo page title.
</h1>
<h3><?= $page['descr']; ?></h3> // Echo page description.
<div class="col-md-12">
<div style="position:relative;">
<img id="pageScreenshot" src="<?php echo cfgRoot; ?>/assets/images/<?= $page['img']; ?>" class="img-responsive" alt="<?= $page['title']; ?>"/> // Echo image filename and page title.
<svg id="svgImageMap" width="1366" height="768">
// For each polygon, echo it's points and key as an index (0, 1, 2, 3...)
<?php foreach ($page["polygon"] as $key => $value) { ?>
<polygon points="<?= $value['points']; ?>" data-originalpoints="<?= $value['points']; ?>" data-id="<?= $key; ?>"/>
<?php } ?>
</svg>
</div>
<!-- data original points: X1,Y1 X2,Y2 X3,Y3 X4,Y4 -->
</br>
<a class="btn btn-success btn-sm btn-block" href="<?php echo cfgRoot; ?>/app/showcase/showcaseView.php">Go Back</a>
</div> <!-- colmd12 -->
</div> <!-- colmd9 -->
</div> <!-- row -->
</div> <!-- container -->
</section> <!-- section -->
When you enter an URL in the browser, you are making a GET HTTP request.
That request can take variables in the form of parameters, by adding ? to the end of your URL and then all the parameters you need, separated by &, like this(based on your example):
nameofthepage.php?id=1&another=2
In PHP, you can catch those parameters using the superglobal $_GET, like this:
$id = $_GET['id'];
By now you should understand #Spectarion answer, that solves your problem.
I don't think any answer should be marked as correct, because these are the basics of working with HTTP with PHP, but that is up to you.
I am trying to use the php code to display a comment box on a page:
$object_id = 'article_12';
include('commentanything/php/loadComments.php');
For some reason the comment box is not appearing where i want it to appear,it keeps throwing the comment box to header, is there any way i can make it appear exactly where i want it to?, here is where i am trying to use it(not a complete code):
<!--<h1 align="center" style="font-size:1.2em"><strong>'.$row['title'].'</strong></h1>-->
<div class="song-art"><img src="'.$this->url.'/thumb.php?src='.$row['art'].'&t=m&w=112&h=112" id="song-art'.$row['id'].'" title="'.$row['title'].'" alt="'.$row['title'].'"/></div>
<div class="song-top">
<div class="song-timeago">
<a href="'.$this->url.'/mp3download/'.$row['id'].'/'.$this->genSlug($row['title']).'.html"><span id="time'.$row['id'].'">
<div class="timeago'.$b.'" title="'.$time.'">
'.$time.'
</div>
</span>
</a>
</div>
<div data-track-name="'.$row['name'].'" data-track-id="'.$row['id'].'" id="play'.$row['id'].'" class="track song-play-btn">
</div>
<div class="song-titles">
<div class="song-author"><a onmouseover="profileCard('.$row['idu'].', '.$row['id'].', 0, 0);" onmouseout="profileCard(0, 0, 0, 1);" onclick="profileCard(0, 0, 1, 1);" href="'.$this->url.'/index.php?a=profile&u='.$row['username'].'">'.realName($row['username'], $row['first_name'], $row['last_name']).'</a></div>
<div class="song-tag">
'.$tag.'
</div>
<div class="song-title">
<div class="track-link"><h2 style="font-size:1.0em">
<!--<div id="song-name'.$row['id'].'">'.$row['title'].'</div>-->
</h2></div>
</div>
</div>
</div>
<div class="player-controls">
<div id="song-controls'.$row['id'].'">
<div id="jp_container_123" class="jp-audio">
<div class="jp-type-single">
<div class="jp-gui jp-interface">
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="track-actions-container">
</div>
'.$extra_links.'
'.$seo_links.'
'.$comment.'
'.$charts.'
</div>';
$object_id = 'article_12';
include('commentanything/php/loadComments.php');
$start = (isset($row['extra_id'])) ? $row['extra_id'] : $row['id'];
}
}
I am trying to display it right after '.$charts.' but it keeps showing up in header
it's looking like you haven't worked to match HTML in index and loadComments.php .
first copy your loadComments.php code in place of include('commentanything/php/loadComments.php');
and check for html/css errors. It's there.
And if it failed too, your php/html nesting is wrong which i cant tell because u don't have even used to know us how and where u are stuffing php. You simply added variables in above displayed code
Im little bit stuck on a logic.scenario is i have a slider where two images are shown at a time taking 50%-50% part of screen,here is the simple html of it,
<div class="zeus-slider zeus-default" >
<div class="zeus-block">
<div class="zeus-slide s-50"> <img src="slider/slider1.jpg" data-effect="slideRight" alt="" /> </div>
<div class="zeus-slide s-50"> <img src="slider/slider2.jpg" data-effect="slideRight" alt="" /> </div>
</div>
</div>
here every block contains two images i have shown only one.now i have trying to make it dynamic, but i didnt get any idea how it will work, so i created database with two tables, each for individual image in a single block.Both table have fields like simg_id(A_I),img_name,simg_path.
here its my php on slider page.
<div class="zeus-block">
<?php
$slider_slt=getResultSet('select * from slider_img_master1 ORDER BY simg_id');
if(mysql_num_rows($slider_slt))
{
while($slider_data=mysql_fetch_assoc($slider_slt))
{
?>
<div class="zeus-slide s-50"> <img src="slider/first/<?php echo $slider_data['simg_path']?>" data-effect="slideRight" alt="" /> </div>
<?php }
} ?>
<?php
$slider_slt2=getResultSet('select * from slider_img_master2 ORDER BY simg_id');
if(mysql_num_rows($slider_slt2))
{
while($slider_data2=mysql_fetch_assoc($slider_slt2))
{
?>
<div class="zeus-slide s-50"> <img src="slider/second/<?php echo $slider_data2['simg_path']?>" data-effect="slideRight" alt="" /> </div>
<?php }
} ?>
</div>
now the problem is when i try to fetch path of image in slider, images are not changing one by one on both half of screen.instead it showing like both images from from both table top, another two images from both tables below 1st both, and so on , so full page is covered with images.
I know this idea of creating two tables for getting two images at once is silly,but i could not think any better.if any one can suggest any better way, it would be so helpful.
Update:getResultSet is function for mysql_query.
if anybody interested i found an answer for above question.
<div id="slide1" >
<div class="zeus-slider zeus-default" >
<?php
$slider_str="select *from slider_img_master1 where simg_status='Active'";
$i=1;
$result=mysql_query($slider_str);
if(mysql_num_rows($result)>0)
{
echo '<div class="zeus-block">';
while($row=mysql_fetch_assoc($result))
{
if($i%2==1 && $i!=1)
{
echo '<div class="zeus-block">';
}
?>
<div class="zeus-slide s-50"> <img src="slider/<?php echo $row['simg_path'];?>" data-effect="slideRight" alt="" /> </div>
<?php
if($i%2==0)
{
echo '</div>';
}
$i++;
}
} ?>
</div>
<div class="clear"> </div>
<div class="next-block"> </div>
<div class="prev-block"> </div>
</div>