I want to display long notes on bootstrap carousel. the notes will be fetched from mySql database. Since the notes are long, i need to split them using number of words then display them in the carousel slides. the problems is that am not able to display the splitted text in different slides. the following is what i have done:
<div class="col-md-6 ">
<div class="panel panel-primary">
<div class="panel-heading">Lecture</div>
<!-- Slider News by Carousel -->
<div id='myCarousel' class='carousel slide' data-ride='carousel'>
<ol class='carousel-indicators'>
<?php
include "config/koneksi.php";
$query = "select notes from notes where Note_ID = 34";
$res = mysqli_query($con, $query);
while ($row = mysqli_fetch_array($res)) {
$w = $row['notes'];
$arr2 = str_split($w, 500);
}
//var_dump($arr2);
$max = sizeof($arr2);
$slides = '';
$Indicators = '';
$counter = 0;
?>
</ol>
<div class='carousel-inner'>
<?php
for ($x = 0; $x <= $max; $x++) {
if ($x == 0) {
echo "<div class='item active'>";
echo $arr2[$x]++;
echo "</div>";
} else {
echo "<div class='item'>";
if (!isset($arr2[$x])) {
$arr2[$x] = 0;
}
echo $arr2[$x]++;
echo "</div>";
}
}
echo "</div>";
echo "<a class='left carousel-control' href='#myCarousel' data-slide='prev'>‹</a>";
echo "<a class='right carousel-control' href='#myCarousel' data-slide='next'>›</a>";
echo "</div>";
echo "<!-- End Slider Caraousel-->";
?>
</div>
</div>
</div>
</div>
the result:
the result
Related
I try to found the solution on google and SO but I haven't got solution.
I have a code something like.
$index = 0;
while (some condition here) {
if ($index < 4) {?>
<div class="first4">
<p>Some text here</p>
</div>
<?php }
else{
$check=0;
if ($check==0){?>
<div class="displayOnceInwhile">
<?php $check=1; }?>
<div class="InsideaboveClass"></div>
<?php }
$index++;}?>
What I am doing with the above code is, if $index is less then 4 then the inner text will display else $check will run only once in the loop but it's not working. Also, Notice here I confused where should I closed the displayOnceInwhile closing </div>.
Expected result
<!--first 4 will display-->
<div class="first4"><p>Some text here</p></div>
<div class="first4"><p>Some text here</p></div>
<div class="first4"><p>Some text here</p></div>
<div class="first4"><p>Some text here</p></div>
<!--Set will display like this-->
<div class="displayOnceInwhile">
<div class="InsideaboveClass"></div>
</div>
Hope This is what you are trying to do is.
<?php
$check = 0;
$index = 0;
while (some condition here) {
if ($index < 4) {
echo '<div class="first4"><p>Some text here</p></div>';
} else {
if ($check==0){
echo '<div class="displayOnceInwhile">';
$check=1;
}
echo '<div class="InsideaboveClass"></div>';
}
$index++;
}
echo '</div>';
?>
You could use following to build your HTML
<?php
$first = '<div class="first4" ><p > Some text here </p ></div >';
$firstOpen = '<div class="first4" ><p > Some text here </p >';
$firstClose = '</div>';
$once = '<div class="displayOnceInwhile"><div class="InsideaboveClass"></div>';
$index = 0;
while ($index < 3) {
echo $first;
$index++;
}
echo $firstOpen;
echo $once;
echo $firstClose;
thanks for taking a look at my question.
I'm trying to get PHP to output bootstrap rows that only contain 2 col-md-6 columns, instead of outputting 1 row with 1 col for each iteration.
Searching here on Stackoverflow I found a solution that makes sense but when I implement it, the HTML that I get makes no sense!
I should be getting this:
<div class="row">
<div class="col-md-6"></div>
<div class="col-md-6"></div>
</div>
<div class="row">
<div class="col-md-6"></div>
<div class="col-md-6"></div>
</div>
...But I'm getting this:
<div class="col-md-6">
<div class="row">
<div class="col-md-6"></div>
<div class="col-md-6"></div>
</div>
<div class="row">
<div class="col-md-6"></div>
<div class="col-md-6"></div>
</div>
</div>
CODE:
<?php
require_once('somedb.php');
$query = mysqli_query($conn, "SELECT * FROM notyourbusiness");
$rowCount = mysqli_num_rows($query);
$i = 0;
echo '<div class="row">';
if($rowCount > 0){
while($row = mysqli_fetch_assoc($query)){
?>
<?php echo '<div class="col-md-6">'; ?>
<img src="img/project/<?php echo $row['thumb'] ?>" class="work-thumbnail" width="100">
<h2><?php echo $row["name"]; ?></h2>
<?php echo '</div>'; ?>
<?php
$i++;
if ($i%2 == 0) echo '</div><div class="row">';
} ?>
<?php } ?>
</div>
Any help will be greatly appreciated, thanks!
Can you provide us more information? It seems that the first is comming from outside of this php code.
You can try this
<?php
$query = mysqli_query($conn, "SELECT * FROM notyourbusiness");
$rowCount = mysqli_num_rows($query);
$i = 0;
if($rowCount > 0){
while($row = mysqli_fetch_assoc($query)){
$row_draw = ($i % 2 == 0) ? true : false;
# Start row div
if ($row_draw)
{
print "<div class='row'>";
}
# Print Column
print "<div class='col-md-6'>";
?>
<img src="img/project/<?php echo $row['thumb'] ?>" class="work-thumbnail" width="100">
<a href="javascript:void(0);">
<h2><?php echo $row["name"]; ?></h2>
</a>
<?php
print "</div>";
# End row div
if ($row_draw)
{
print "</div>";
}
$i++;
}
}
?>
The search results should display like this
But my results are stacking on top of each.
Here is my code :
<div class="container">
<?php
mysql_connect("localhost", "root", "") or die(mysql_error());
mysql_select_db("thesis") or die(mysql_error());
$search = trim( $_POST['SearchKeywords']);
$query = " SELECT * FROM new_data WHERE Product_Title or Product_link LIKE'%$search%' ";
$sql = mysql_query($query) or die(mysql_error());
$count = mysql_num_rows($sql);
$count == 0;
if ($count == 0) {
echo "Sorry, Nothing Found !!";
}else{
while ($row = mysql_fetch_array($sql))
{
$img = $row ['Product_Img'];
$link = $row ['Product_link'];
$title = $row ['Product_Title'];
$price = $row ['Product_Price'];
?>
<div class="card">
<div class="front alert alert-success">
<?php echo "$title";
echo "<img src='$img' width='80px' height='100px'>";
echo "$price"; ?>
</div>
</div>
<?php
};
};
?>
</div> <!-- Container -->
Those div blocks are inside a container.
I added a bootstrap class in order for better a design.
You can use thumbnails with custom content
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img src="..." alt="...">
<div class="caption">
<h3>Thumbnail label</h3>
<p>...</p>
<p>Button Button</p>
</div>
</div>
</div>
</div>
I used a counter inside while loop.
Which will check, when there are already 4 blocks/ products in a single row then it will create a new row
<?php
if($productCount == 0)
{
echo "<div class='row'>"; }
}
$productCount++;
if($productCount==4)
{
echo "</div>" ;
$productCount = 0;
}
?>
I have set-up a news page which retrieves news from MYSQL news table.
I am trying to identify if the news column is odd or even, so if the news columns is odd or even it will add a class to the div element.
My code is as follows:
<?php
$cat = $_GET['cat'];
$date = $_GET['date'];
if ($date !="") {
$date = explode('-', $date);
$year = $date[1];
$month = $date[0];
$month = date("m", strtotime($month));
$sql = "SELECT * FROM news WHERE year(newsDate) = '$year' AND month(newsDate) = '$month' AND newsState = 1 ORDER BY newsDate DESC";
} else {
$sql = "SELECT * FROM news WHERE newsState = 1 ORDER BY newsDate DESC";
}
$result = $conn->query($sql);
$rows = $result->num_rows;
$pager = new PS_Pagination($conn, $sql, 5, 10, null);
$rs = $pager->paginate();
$num = $rs->num_rows;
if($num >= 1 ){
while($row = $rs->fetch_assoc()){
?>
<div class="news <?php echo $num; ?>">
<div class="four columns">
<p><img src="/news-images/thumbs/thumb_<?php echo $row['newsImage1']; ?>" alt=""/></p>
</div>
<div class="eight columns">
<h3><?php echo $row['newsTitle']; ?></h3>
<p><?php echo stripslashes(strip_tags($row['newsDescription'])); ?></p>
</div>
</div>
<?php } } else {
echo "No records found!";
}
if ($rows >= 5) {
echo "<div class='page-nav blog-nav'>";
echo $pager->renderFullNav();
echo "</div>";
}
?>
TAke any flag which maintains odd-even position...
$f = 0; //ADDED THIS LINE
if($num >= 1 ){
while($row = $rs->fetch_assoc()){
if($f%2==0) //ADDED THIS LINE
$class_name = "even"; //ADDED THIS LINE
else //ADDED THIS LINE
$class_name = "odd"; //ADDED THIS LINE
?>
<div class="news <?php echo $class_name; ?>">
<div class="four columns">
<p><img src="/news-images/thumbs/thumb_<?php echo $row['newsImage1']; ?>" alt=""/></p>
</div>
<div class="eight columns">
<h3><?php echo $row['newsTitle']; ?></h3>
<p><?php echo stripslashes(strip_tags($row['newsDescription'])); ?></p>
</div>
</div>
<?php $f++; } } else {
echo "No records found!";
}
if($num >= 1 ){
$tr = 1;
while($row = $rs->fetch_assoc()){
if($tr%2 == 0)
{
//then even class
}
else
{
//odd class
}
?>
<div class="news <?php echo $num; ?>">
<div class="four columns">
<p><img src="/news-images/thumbs/thumb_<?php echo $row['newsImage1']; ?>" alt=""/></p>
</div>
<div class="eight columns">
<h3><?php echo $row['newsTitle']; ?></h3>
<p><?php echo stripslashes(strip_tags($row['newsDescription'])); ?></p>
</div>
</div>
<?php $tr++; } } else {
echo "No records found!";
}
Use counter variable and check if it is even or odd ?
Create variable, increment that in each loop and check, if $i % 2 is 0 (even) or 1 (odd).
$i = 1;
while($row = $rs->fetch_assoc()){
?>
<div class="news <?php echo $num; echo $i % 2 == 0 ? ' even' : ' odd' ?>">
<div class="four columns">
<p><img src="/news-images/thumbs/thumb_<?php echo $row['newsImage1']; ?>" alt=""/></p>
</div>
<div class="eight columns">
<h3><?php echo $row['newsTitle']; ?></h3>
<p><?php echo stripslashes(strip_tags($row['newsDescription'])); ?></p>
</div>
</div>
<?php
$i++;
}
Take $classname = '';
Get news ID in loop and divide / 2 and compare whether you getting odd / even value. In case odd value add $classname = 'oddCLASS' and in case even value add $classname = 'evenCLASS' and updare class = $classname wherever you required.
This way it will automatically update dynamic class.
so the fastest way to do this is just by using a boolean:
$odd = false;
while ( .... )
{
echo ($odd = !$odd) ? 'odd' : 'even';
}
No need to keep a counter for that, no need for a modulo and it keeps the code pretty clean. My preferred way unless you need to keep a counter. And even then: $counter & 1 == 1 is faster than $counter % 2 == 1 and does exactly the same.
Simple explanation:
echo ($odd = !$odd) ? 'odd' : 'even';
// will become
$odd = ! $odd; // it flips the boolean
if ($odd)
echo 'odd';
else
echo 'even';
Hi I am using Bootstrap 2 with a PHP content management system.
I am rendering 12 items from the database, each 3 items needs to be wrapped in a row. However I am unable to achieve this my last attempt is below (with simplified markup):
$i = 1;
echo "<div class='row-fluid'>";
foreach($posts as $p) {
if ($i % 3 == 0) {
echo "</div>";
}
if ($i % 4 == 0) {
echo "<div class='row-fluid'>";
}
echo "<div class='span4'><h5>$p->title</h5></div>";
$i++;
}
In affect what I am looking for is something like this:
<div class="row">
<div class="item></item>
<div class="item"</item>
<div class="item"></item>
</div>
<div class="row">
<div class="item></item>
<div class="item"</item>
<div class="item"></item>
</div>
<div class="row">
<div class="item></item>
<div class="item"</item>
<div class="item"></item>
</div>
<div class="row">
<div class="item></item>
<div class="item"</item>
<div class="item"></item>
</div>
I have tried everything I can think of any help would be great thanks.
Try if there are 12 rows :
echo "<div class='row-fluid'>";
foreach($posts as $p) {
echo "<div class='span4'><h5>$p->title</h5></div>";
if ($i % 3 == 0) {
echo "</div>";
echo ( $i< 12 )? "<div class='row-fluid'>" : "";
}
$i++;
}
I think this will work
$i = 0;
echo "<div class='row-fluid'>";
foreach($posts as $p) {
echo "<div class='span4'><h5>$p->title</h5></div>";
if ($i % 3 == 0) {
echo "</div><div class='row-fluid'>";
}
$i++;
}
echo "</div>";