Split mysql data into 3 bootstrap md columns with php - php

im trying to divide some info retrieved from a mysql db to 3 columns ("col-md-4") without repeating the info. I have been have trouble with mysqli_fecth_assoc() beacuse it replicates the info in all columns. Any idea? Thanks in advance
<div class="container-fluid">
<div class="row">
<?php while($fila = mysqli_fetch_assoc($resultado)){ ?>
<div class="col-md-4">
<p><?php echo $fila["Nombre"];?></p>
<HR WIDTH="50%" SIZE="3">
</div>
<div class="col-md-4">
<p><?php echo $fila["Nombre"];?></p>
<HR WIDTH="50%" SIZE="3">
</div>
<div class="col-md-4">
<p><?php echo $fila["Nombre"];?></p>
<HR WIDTH="50%" SIZE="3">
</div>
<?php } ?>
</div>
the problem with thath code is that it repeats the same $fila["Nombre"] in all columns.

I think this code will help to get the expected result.
<?php
$tempFila = array();
while($fila = mysqli_fetch_assoc($resultado)){
$tempFila[] = $fila["Nombre"];
}
$count = count($tempFila);
?>
<div class="container-fluid">
<div class="row">
<?php for ($i = 0; $i < $count;) { ?>
<div class="col-md-4">
<p><?php echo (!empty($tempFila[$i])) ? $tempFila[$i] : ''; $i++; ?></p>
<HR WIDTH="50%" SIZE="3">
</div>
<div class="col-md-4">
<p><?php echo (!empty($tempFila[$i])) ? $tempFila[$i] : ''; $i++; ?></p>
<HR WIDTH="50%" SIZE="3">
</div>
<div class="col-md-4">
<p><?php echo (!empty($tempFila[$i])) ? $tempFila[$i] : ''; $i++; ?></p>
<HR WIDTH="50%" SIZE="3">
</div>
<?php } ?>
</div>
</div>

Related

How to display a particular div in jquery?

I have written some code for displaying a particular div in html. The code is shown below :
<div id="pdfdiv_1">
<section class="report">
<div class="top-box"></div>
<div class="row">
<div class="col-md-12 text-center">
<img src="<?php echo base_url()?>reports-assets-new/images/banner.png" class="bannerimg" style="
width: auto;">
</div>
<div class="col-md-5">
<div class="info-wrapper">
<?php if(!empty($user_details->st_profile)){ ?>
<img src="<?php echo base_url();?>uploads/user-profile/<?php echo $user_details->st_profile;?>" style="width: 22%;">
<?php } else {?>
<img src="<?php echo base_url()?>reports-assets-new/images/img2.png">
<?php } ?>
<div class="info-wrap-inner">
<p><span>Name </span> : <?php echo $user_details->st_name;?></p>
<p><span>Age </span> : <?php echo $age;?></p>
<p><span>Education </span> : <?php echo $user_details->st_qualification;?></p>
<p><span>Mobile </span> : <?php echo $user_details->st_mobile;?></p>
<p><span>Email </span> : <?php echo $user_details->st_email;?></p>
<p><span>Date of test </span> : <?php $s=$user_details->c_date; $dt = new DateTime($s); $date = $dt->format('d-m-Y'); echo $date; ?></p>
</div>
</div>
</div>
<div class="col-md-7 report-wrapper">
<h1 class="heading">SKILL FINDER TEST REPORT</h1>
<p><?php echo $test_details->description;?></p>
</div>
</div>
</div>
</section>
<section class="skills">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1><span>IDENTIFY SKILLS BASED ON YOUR INTERESTS</span></h1>
</div>
</div>
<div class="row">
<?php echo $test_details->description3;?>
</div>
</section>
</div><!-- pdfdiv close -->
I have written a code for displaying the div pdfdiv_1 in jquery as shown below :
<script>
function pdfP(exam_id,test_id,base_url) {
var test = document.getElementById('pdfdiv_1').innerHTML;
console.log(test);
$.ajax({
type: 'POST',
data: {test : test,exam_id:exam_id,test_id:test_id},
url: base_url+"reports/reports_pdf_new/skill_finder",
success: function (data) {
window.location.href = base_url+"reports_pdf_new/"+exam_id+"/"+test_id;
},
});
}
</script>
When I am printing the console output, it is only printing the first section part but not the second section tag.
The output in console is :
<section class="report">
<div class="top-box"></div>
<div class="row">
<div class="col-md-12 text-center">
<img src="<?php echo base_url()?>reports-assets-new/images/banner.png" class="bannerimg" style="
width: auto;">
</div>
<div class="col-md-5">
<div class="info-wrapper">
<?php if(!empty($user_details->st_profile)){ ?>
<img src="<?php echo base_url();?>uploads/user-profile/<?php echo $user_details->st_profile;?>" style="width: 22%;">
<?php } else {?>
<img src="<?php echo base_url()?>reports-assets-new/images/img2.png">
<?php } ?>
<div class="info-wrap-inner">
<p><span>Name </span> : <?php echo $user_details->st_name;?></p>
<p><span>Age </span> : <?php echo $age;?></p>
<p><span>Education </span> : <?php echo $user_details->st_qualification;?></p>
<p><span>Mobile </span> : <?php echo $user_details->st_mobile;?></p>
<p><span>Email </span> : <?php echo $user_details->st_email;?></p>
<p><span>Date of test </span> : <?php $s=$user_details->c_date; $dt = new DateTime($s); $date = $dt->format('d-m-Y'); echo $date; ?></p>
</div>
</div>
</div>
<div class="col-md-7 report-wrapper">
<h1 class="heading">SKILL FINDER TEST REPORT</h1>
<p><?php echo $test_details->description;?></p>
</div>
</div>
</div>
</section>
Can anyone help me out in this ?
I cant print all the html code present inside the div pdfdiv_1.
The html code :
<div class="download-pdf">
<div class="row">
<div class="col-12">
<div class="card p-4 mt-0">
<h2 class="text-center mb-0">Congratulations!</h2>
<p class="lead text-center" style="margin-top: -18px">
<br>
<div class="button-wrapper" style="text-align: center;">
<button onclick="pdfP(<?php echo $exam_id;?>,<?php echo $test_id;?>,'<?php echo base_url();?>')" class="btn btn-primary d-block mx-auto">Download PDF</button>
<span id="pdfloader"></span>
</div>
</div>
</div>
</div>
</div>
There are some mistakes on html tags placement.
This code might fix them :
<div id="pdfdiv_1">
<section class="report">
<div class="top-box"></div>
<div class="row">
<div class="col-md-12 text-center">
<img src="<?php echo base_url()?>reports-assets-new/images/banner.png" class="bannerimg" style="
width: auto;">
</div>
<div class="col-md-5">
<div class="info-wrapper">
<?php if(!empty($user_details->st_profile)){ ?>
<img src="<?php echo base_url();?>uploads/user-profile/<?php echo $user_details->st_profile;?>" style="width: 22%;">
<?php } else {?>
<img src="<?php echo base_url()?>reports-assets-new/images/img2.png">
<?php } ?>
<div class="info-wrap-inner">
<p><span>Name </span> : <?php echo $user_details->st_name;?></p>
<p><span>Age </span> : <?php echo $age;?></p>
<p><span>Education </span> : <?php echo $user_details->st_qualification;?></p>
<p><span>Mobile </span> : <?php echo $user_details->st_mobile;?></p>
<p><span>Email </span> : <?php echo $user_details->st_email;?></p>
<p><span>Date of test </span> : <?php $s=$user_details->c_date; $dt = new DateTime($s); $date = $dt->format('d-m-Y'); echo $date; ?></p>
</div>
</div>
</div>
<div class="col-md-7 report-wrapper">
<h1 class="heading">SKILL FINDER TEST REPORT</h1>
<p><?php echo $test_details->description;?></p>
</div>
</div>
</section>
<section class="skills">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1><span>IDENTIFY SKILLS BASED ON YOUR INTERESTS</span></h1>
</div>
</div>
<div class="row">
<?php echo $test_details->description3;?>
</div>
</div>
</section>
</div><!-- pdfdiv close -->
Generally the IDE show these errors in red.
Example with IntelliJ softwares :

Html is still visible in CodeIgniter using if else

I'm here trying to make if else condition to hiding the html part if $addons_facts var is empty. I am making the addon visible on the food item if the $addons_facts var is not empty.
<?php $addon_data = $this->addons_model->get_addon_by_menu_id($menu_details['id']);
$addons_facts = json_decode($addon_data->addon_fact, true);
?>
<?php if(!empty($addons_facts) && $addons_facts !=='') : ?>
<div class="form-group">
<div class="row">
<div class="col-md-12">
<?php
foreach ($addons_facts as $key => $addon_fact) : ?>
<div class="row">
<div class="col-md-1">
<div class="checkbox">
<label for="check">
<input type="checkbox" id="check" />
<span class="fake-input"></span>
</label>
</div>
</div>
<div class="col-md-7 text-left">
<?php echo sanitize($key); ?>
</div>
<div class="col-md-3">
<?php echo currency(sanitize($addon_fact));?>
</div>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<?php endif; ?>
When data is present in $addons_facts
When data is absent $addons_facts
As you can clearly see that when data is not present and the html is still visible (checkbox or $). I already tried if else both but unable to figure it out what is going wrong and why if condition not hiding the whole content within if{}.
I figure it out the solution by this: <?php if(!empty($key)) : ?>
<div class="form-group">
<div class="row">
<div class="col-md-12">
<?php
foreach ($addons_facts as $key => $addon_fact) : ?>
<?php if(!empty($key)) : ?>
<?php $randomNum = substr(str_shuffle("0123456789abcdefghijklmnopqrstvwxyzABCDEFGHIJKLMNOPQRSTVWXYZ"), 0, 10); ?>
<div class="row">
<div class="col-1">
<div class="checkbox">
<label for="<?php echo $randomNum; ?>">
<input type="checkbox" id="<?php echo $randomNum; ?>" />
<span class="fake-input"></span>
</label>
</div>
</div>
<div class="col-7 text-left">
<?php echo sanitize($key); ?>
</div>
<div class="col-3">
<?php echo sanitize($addon_fact) ? currency(sanitize($addon_fact)) :'';?>
</div>
</div>
<?php endif; ?>
<?php endforeach; ?>
</div>
</div>
</div>

how to fetch database records as <div>s without changing fixed <div>s in left and right side?

layout image:
I want to design bootstrap div layout as shown in this picture. I need to have to banner advertisement in the left and right corner. In the middle, I need to have dynamic div s which fetch data from database using PHP. But in the middle when I fetch data as dynamic divs, when number of records increases, the second banner advertisement goes down. How can I solve this?
<div class="col-lg-2" style="padding-top: 50px;">
<div class="card" >
<img src="img/cement_Ad.jpg" height="500" width="300">
</div>
</div>
<!-- 2 -->
<div class="col-lg-8" style="padding-left: 250px;">
<!-- 4 -->
<?php
$sql="select * from services ";
$result = $con->query($sql);
if ($result->num_rows > 0) {
?>
<?php
while($row = $result->fetch_assoc()) {
?>
<div class="col-lg-3" style="padding-top: 40px; padding-left: 20px;">
<section>
<div class="well" >
<div class="card" >
<div class="row ">
<div class="col-md-4">
<img src="img/img1.jpg" height="150px" width="120px">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title"><?php echo $row ['name']; ?></h4>
<div >
<label>Email</label>
<?php echo $row ['email']; ?>
</div>
<div >
<label>Address</label>
<?php echo $row ['address']; ?>
</div>
<div >
<label>District</label>
<?php echo $row ['district']; ?>
</div>
<div >
<label>City</label>
<?php echo $row ['city']; ?>
</div>
<div >
<label>Service</label>
<?php echo $row ['service']; ?>
</div>
<div >
<label>Years of Experience</label>
<?php echo $row ['years']; ?>
</div>
<div>
<label>Details</label>
<?php echo $row ['details']; ?>
</div>
Read More
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<?php
}
} else {
echo "0 results";
}
$con->close();
?>
</div>
<div class="col-lg-2" style="padding-top: 50px; ">
<div class="card" >
<img src="img/pipe_Ad.jpg" height="500" width="300">
</div>
</div>
This is the result after I used Mr.E-Azam's answer given below
Check Below-
<div class="col-lg-2" style="padding-top: 50px;">
<div class="card" >
<img src="img/cement_Ad.jpg" height="500" width="300">
</div>
</div>
<!-- 2 -->
<div class="col-lg-8">
<!-- 4 -->
<?php
$sql="select * from services ";
$result = $con->query($sql);
if ($result->num_rows > 0) {
?>
<?php
while($row = $result->fetch_assoc()) {
?>
<div class="col-lg-3" style="padding-top: 40px;">
<section>
<div class="well" >
<div class="card" >
<div class="row ">
<div class="col-md-4">
<img src="img/img1.jpg" height="150px" width="120px">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title"><?php echo $row ['name']; ?></h4>
<div >
<label>Email</label>
<?php echo $row ['email']; ?>
</div>
<div >
<label>Address</label>
<?php echo $row ['address']; ?>
</div>
<div >
<label>District</label>
<?php echo $row ['district']; ?>
</div>
<div >
<label>City</label>
<?php echo $row ['city']; ?>
</div>
<div >
<label>Service</label>
<?php echo $row ['service']; ?>
</div>
<div >
<label>Years of Experience</label>
<?php echo $row ['years']; ?>
</div>
<div>
<label>Details</label>
<?php echo $row ['details']; ?>
</div>
Read More
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<?php
}
} else {
echo "0 results";
}
$con->close();
?>
</div>
<div class="col-lg-2" style="padding-top: 50px; ">
<div class="card" >
<img src="img/pipe_Ad.jpg" height="500" width="300">
</div>
</div>
I could solve the problem just by changing col-lg sizes. The answer is given below
<div class="col-lg-12">
<div class="col-lg-2" >
<div class="card" >
<img src="img/cement_Ad.jpg" height="500" width="300">
</div>
</div>
<div class="col-lg-8">
<?php
$sql="select * from services ";
$result = $con->query($sql);
if ($result->num_rows > 0) {
?>
<?php
while($row = $result->fetch_assoc()) {
?>
<div class="col-lg-6" style="padding-top: 20px;">
<section>
<div class="well" >
<div class="card" >
<div class="row ">
<div class="col-md-4">
<img src="img/img1.jpg" height="150px" width="120px">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title"><?php echo $row ['name']; ?></h4>
<div >
<label>Email</label>
<?php echo $row ['email']; ?>
</div>
<div >
<label>Address</label>
<?php echo $row ['address']; ?>
</div>
<div >
<label>District</label>
<?php echo $row ['district']; ?>
</div>
<div >
<label>City</label>
<?php echo $row ['city']; ?>
</div>
<div >
<label>Service</label>
<?php echo $row ['service']; ?>
</div>
<div >
<label>Years of Experience</label>
<?php echo $row ['years']; ?>
</div>
<div>
<label>Details</label>
<?php echo $row ['details']; ?>
</div>
Read More
</div>
</div>
</div>
</div>
</section>
</div>
<?php
}
} else {
echo "0 results";
}
$con->close();
?>
</div>
<div class="col-lg-2" >
<div class="card" >
<img src="img/pipe_Ad.jpg" height="500" width="300">
</div>
</div>
</div>

How can i create permanently accessible urls from database entries?

I am trying to make a mirror of the this site for my own country, but I am having a hard time comperehending how to create new urls from my database entries.
For example as on the site I linked, it has and id/name to identify that exacty site, i want to achieve the same to make seperate questions shareable.
My current code is only created to test with 1 question on localhost url.
Here's a little snippet of what I've currently got:
<?php
$id = 1;
$result = performQuery("SELECT * FROM dilemmas WHERE id = ".$id);
while($row = mysqli_fetch_array($result)){
$blue_question = utf8_encode($row['blue_question']);
$blue_votes = utf8_encode($row['blue_votes']);
$red_question = utf8_encode($row['red_question']);
$red_votes = utf8_encode($row['red_votes']);
}
?>
<div class="answer-peek">
<div class="peek-text">Vil du helst...</div>
<div class="peek-buttons">
<div class="peek-bluebutton"><?php echo $blue_question ?></div>
<div class="peek-redbutton"><?php echo $red_question ?></div>
</div>
</div>
<div class="row text-center" id="textrow">
<h3 style="color:white;">Vil du helst...</h3>
</div>
<div class="row" id="buttonrow">
<div class="col-md-1">
<div class="button-left"></div>
</div>
<div class="col-md-10"><
<div class="col-md-5 col-md-offset-1 button" id="bluebutton">
<div class="blueCheckDiv"></div>
<div id="text-container">
<table cellpadding="0">
<tbody>
<tr>
<td valign="middle">
<div class="result">
<div class="percentage">
<?php
$percent = $blue_votes/($blue_votes + $red_votes);
$percent_friendly = number_format( $percent * 100, 0 ) . '%';
echo $percent_friendly;
?>
</div>
<div class="total-votes">
<span class="count">
<?php echo $blue_votes; ?>
</span>
<span class="word">
enige
</span>
</div>
<div class="question-text">
<?php echo $blue_question ?>
</div>
</div>
<p class="question">
<?php echo $blue_question ?>
</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="col-md-5 button" id="redbutton">
<div class="redCheckDiv"></div>
<div id="text-container">
<table cellpadding="0">
<tbody>
<tr>
<td valign="middle">
<div class="result">
<div class="percentage">
<?php
$percent = $blue_votes/($blue_votes + $red_votes);
$percent_friendly = number_format( $percent * 100, 2 ) . '%';
echo $percent_friendly;
?>
</div>
<div class="total-votes">
<span class="count">
<?php echo $red_votes ?>
</span>
<span class="word">
uenige
</span>
</div>
<div class="question-text">
<?php echo $red_question ?>
</div>
</div>
<p class="question">
<?php echo $red_question ?>
</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="col-md-1">
<div class="button-right"></div>
</div>
</div>
<div class="row" id="dividerrow">
<div class="col-md-8" id="divider-left"></div>
<div class="col-md-4" id="divider-right"></div>
</div>
<div class="row" id="socialrow">
<div class="col-md-8 socialcol" id="col-left"></div>
<div class="col-md-4 socialcol" id="col-right"></div>
</div>
I suggested you to use a framework in the comments to your question.
Anyway, to do what you are trying, you can try something like this:
<?php
$id = 1;
if (true === isset($_GET['id'])) {
$id = $_GET['id'];
}
$result = performQuery("SELECT * FROM dilemmas WHERE id = ".$id);
while($row = mysqli_fetch_array($result)){
$blue_question = utf8_encode($row['blue_question']);
$blue_votes = utf8_encode($row['blue_votes']);
$red_question = utf8_encode($row['red_question']);
$red_votes = utf8_encode($row['red_votes']);
}
And you can call this same page with something like example.com/page.php?id=1234.
So, you can build links for each question like this:
Share
NOTE: This is a really dirty code and it opens to a lot of security issues. I wrote it only to make you able to understand the dynamics, but, again, I suggest you to use a framework on the first start: make all in "plain" PHP will cause you to deal with a lot of complex problems like the security or the handling of routing or services, etc... Use a framework to find very good guidance and to learn faster and better the language of your choice (PHP in this case).

Add a Row After 6 Records Automatically

Here Is The Code
<div class="row">
<div class="col-md-9 column">
<div class="services-listing">
<?php if(!empty($data)):
foreach ($data as $rows ) : ?>
<div class="service">
<div class="service-img"><span><img src="dashboard/uploads/<?php echo $rows['img'];?>" alt="" /></div>
<div class="service-detail">
<h3><?php echo $rows['name'];?></h3>
</div>
</div>
<!-- Service -->
<?php endforeach; else : echo "No Record Found Against This Services"; endif;?>
</div>
<!-- Service Listing -->
</div>
i want to start design from <div class="row"> not from <div class="service"> now it repeating this div i want new <div class="row"> genrated after every 6 records
<div class="row">
<div class="col-md-9 column">
</div>
</div>
Looking for something like this, let me know if it works for you
<?php
$start = 6;
$end = 1;
if(!empty($data)){
foreach ($data as $rows ) {
if ($start % 6 == 0) { ?>
<div class="row">
<div class="col-md-9 column">
<?php } ?>
<div class="services-listing">
<div class="service">
<div class="service-img"><span><img src="dashboard/uploads/<?php echo $rows['img'];?>" alt="" /></div>
<div class="service-detail">
<h3><?php echo $rows['name'];?></h3>
</div>
</div>
<!-- Service -->
</div>
<?php if ($end % 6 == 0) { ?>
</div>
</div>
<?php } $start++; $end++;
}
}
else{ echo "No Record Found Against This Services"; }
?>
you need to wrap div row with foreach first and then:
<?php $i = 0; ?>
<?php if(!empty($data)):
foreach ($data as $rows ) : ?>
<?php $i++; ?>
<div class="row">
<div class="col-md-9 column">
<div class="services-listing">
<div class="service">
<div class="service-img"><span><img src="dashboard/uploads/<?php echo $rows['img'];?>" alt="" /></div>
<div class="service-detail">
<h3><?php echo $rows['name'];?></h3>
</div>
<!-- Service -->
</div>
<!-- Service Listing -->
</div>
<!-- col-md-9 column -->
</div>
<!-- Row -->
</div>
<?php if($i%6==0):?>
<div class="row">
<div class="col-md-9 column">
</div>
</div>
<?php endif; ?>
<?php endforeach; else : echo "No Record Found Against This Services"; endif;?>
just please re-check all divs structure to be sure whether all of them are closed

Categories