Im turning a static slider revolution in a dynamic.
Images are uploading and fetching perfect from Mysql DB but the texts (top-text) is showing only in the first slide. The rest is empty.
Here is the Code
Any help would be great.
Thanks in advance.
UPLOAD.php
<?php
// Include the database configuration file
include 'database/dbConfig.php';
$statusMsg = '';
// File upload path
$targetDir = "uploads/";
$fileName = basename($_FILES["file"]["name"]);
$top_text = filter_input(INPUT_POST, 'top_text');
$targetFilePath = $targetDir . $fileName;
$fileType = pathinfo($targetFilePath,PATHINFO_EXTENSION);
if(isset($_POST["submit"]) && !empty($_FILES["file"]["name"])){
// Allow certain file formats
$allowTypes = array('jpg','png','jpeg','gif','pdf');
if(in_array($fileType, $allowTypes)){
// Upload file to server
if(move_uploaded_file($_FILES["file"]["tmp_name"], $targetFilePath)){
// Insert image file name into database
$insert = $db->query("INSERT into images (file_name, top_text, uploaded_on) VALUES ('".$fileName."', '".$top_text."', NOW())");
if($insert){
$statusMsg = "The file ".$fileName. " has been uploaded successfully.";
}else{
$statusMsg = "File upload failed, please try again.";
}
}else{
$statusMsg = "Sorry, there was an error uploading your file.";
}
}else{
$statusMsg = 'Sorry, only JPG, JPEG, PNG, GIF, & PDF files are allowed to upload.';
}
}else{
$statusMsg = 'Please select a file to upload.';
}
// Display status message
echo $statusMsg;
?>
SLIDER
<!-- Revolution slider -->
<section id="slider">
<div class="tp-banner-container ">
<div class="tp-banner rev-banner-fullscreen">
<ul>
<!-- SLIDE -->
<?php
// Include the database configuration file
include 'database/dbConfig.php';
// Get images from the database
$query = $db->query("SELECT * FROM images ORDER BY uploaded_on DESC");
if($query->num_rows > 0){
while($row = $query->fetch_assoc()){
$imageURL = 'uploads/'.$row["file_name"];
$top_text = $row['top_text'];
?>
<!-- DYNAMIC SLIDE -->
<li data-index="rs-140" data-transition="slideup" data-slotamount="default" data-easein="default" data-easeout="default" data-masterspeed="default" data-thumb="" data-rotate="0" data-saveperformance="off" data-title="1/2" data-description="">
<!-- MAIN IMAGE -->
<img src="<?php echo $imageURL; ?>" alt="" style='background-color:#f4f4f4' alt="" width="482" height="800" data-bgposition="center center" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina>
<!-- LAYERS -->
<!-- LAYERS 1.2 -->
<div class="tp-caption tp-resizeme" id="slide-1-layer-2" data-x="['left','left','left','left']" data-hoffset="['102','102','67','40']" data-y="['top','top','top','top']" data-voffset="['150','150','60','60']" data-fontsize="['18','18','14','14']" data-width="['345','345','345','259']" data-height="none" data-whitespace="normal" data-transform_idle="o:1;" data-transform_in="y:50%;z:0;rX:0deg;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0;s:900;e:Power4.easeInOut;" data-transform_out="x:-50%;opacity:0;s:800;e:Power2.easeInOut;s:300;e:Power2.easeInOut;" data-start="500" data-splitin="none" data-splitout="none" data-responsive_offset="on" style="z-index: 6; min-width: 345px; max-width: 345px; white-space: normal; color: #3e3e3e; font-family: 'Montserrat'; letter-spacing: 7px;">
<?php echo $top_text; ?>
</div>
<!-- /END DYNAMIC SLIDE -->
</li>
<?php }
}else{?>
<!-- DEFAULT SLIDE -->
<li data-index="rs-140" data-transition="slideup" data-slotamount="default" data-easein="default" data-easeout="default" data-masterspeed="default" data-thumb="" data-rotate="0" data-saveperformance="off" data-title="1/2" data-description="">
<!-- MAIN IMAGE -->
<img src="images/slide/slide-5-bg.jpg" style='background-color:#f4f4f4' alt="" width="482" height="800" data-bgposition="center center" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina>
<!-- LAYERS -->
<!-- LAYERS 1.2 -->
<div class="tp-caption tp-resizeme" id="slide-1-layer-2" data-x="['left','left','left','left']" data-hoffset="['102','102','67','40']" data-y="['top','top','top','top']" data-voffset="['150','150','60','60']" data-fontsize="['18','18','14','14']" data-width="['345','345','345','259']" data-height="none" data-whitespace="normal" data-transform_idle="o:1;" data-transform_in="y:50%;z:0;rX:0deg;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0;s:900;e:Power4.easeInOut;" data-transform_out="x:-50%;opacity:0;s:800;e:Power2.easeInOut;s:300;e:Power2.easeInOut;" data-start="500" data-splitin="none" data-splitout="none" data-responsive_offset="on" style="z-index: 6; min-width: 345px; max-width: 345px; white-space: normal; color: #3e3e3e; font-family: 'Montserrat'; letter-spacing: 7px;">
New Arrival
</div>
<!-- /END DEFAULT SLIDE -->
<?php } ?>
</li>
<!-- /SLIDE 1 -->
</ul>
</div>
<!-- /tp-banner -->
</div>
<!-- /tp-banner-container -->
</section>
<!-- /#Revolution slider -->
