The first part corresponds to the js code where I call a file that executes the for cycle, but it does not give me the line breaks, putting everything in a column.
<script>
$(document).ready(function() {
$("#nivel-especialidad").change(function() {
$("#nivel-especialidad option:selected").each(function() {
Id = $(this).val();
$.post("../Sql/ArregloRequisitos.php", {Id: Id
}, function(data){
$("#requisitos-nivel").html(data);
});
});
})
});
</script>
In this second part is the HTML code within the For cycle:
<?php
$conexion = new PDO("mysql:host=localhost;dbname=scouts_601_palmira","root","");
$Id_nivel = $_POST['Id'];
echo '<script type="text/javascript">alert("'.$Id_nivel.'");</script>';
$sql3 = "SELECT Id, Texto FROM Requisitos WHERE Id_nivel =".$Id_nivel."";
$sentencia3 = $conexion -> prepare($sql3);
$sentencia3 -> execute();
$requisitos = $sentencia3 -> fetchAll();
echo "<tr>";
for ($i = 0, $contador=1; $i < count($requisitos); $i++, $contador++) {?>
<td>
<div class="card" style="width: 20rem;">
<!--<img class="card-img-top" src="..." alt="Card image cap">-->
<div class="card-body">
<p class="card-text"><?php
echo $requisitos[$i]['Texto'];
?></p>
<input type="checkbox">
</div>
</div>
</td>
<?php if(($contador%3) == 0) {
echo "</tr><tr>";
}
}
echo "</tr>";
?>
As it is, the code prints everything in a single column, one div on the other. What I want is that as the if condition says at the end, it is to show a div side by side and when three (columns) have already been shown, the line break is made, and this repeatedly until all the data is printed obtained from the BD.
I thank you in advance for any solution to this problem.
Currently it looks like this:
I want it to look like this:
I think, here is the inconvenient:
Related
The copy to clipboard feature with a button works if it is only has exact variable however if it is a echo'd variable which is different on each row then it only copys the first row no matter which button you click. I have tried many different methods and they all seem to do the same. Is there something which I can add in the code which would make the correct row button copy the correct row $dir ?
function copy(element_id) {
var aux = document.createElement("div");
aux.setAttribute("contentEditable", true);
aux.innerHTML = document.getElementById(element_id).innerHTML;
aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)");
document.body.appendChild(aux);
aux.focus();
document.execCommand("copy");
document.body.removeChild(aux);
}
<p id="demo">
<?php echo $dir ?>
</p>
<button onclick="copy('demo')">Copy Keeping Format</button> <br><br>
Code:
$numresults=$info["count"];
echo"<div style='position: fixed; float: right; padding-left: 450px;'><a class=clear href=javascript:history.go(-1)>Search again</a></div>";
echo "<div><p>There are <b>$numresults</b> results for your search '<i><b>$SearchFor</i></b>'";
if ($numresults>0){
echo " these are:</p></div>";
echo "<div>";
for ($x=0; $x<$numresults; $x++) { //display the results
$sam=$info[$x]['samaccountname'][0];
$disp=$info[$x]['displayname'][0];
$dir=$info[$x]['homedirectory'][0];
$fil=$info[$x]['homedirectory'] [0];
$displayout=substr($sam, 0, 4);
echo "User Name : $sam";
echo "<br>Name : $disp";
echo "<br>Home Drive : <a class=clear href=$dir>$dir</a><br>";?>
<p id="demo<?php echo $i; ?>">
<?php echo $dir ?>
</p>
<button onclick="copy('demo<?php echo $i; ?>')">Copy Keeping Format</button> <br><br>
<script>
function copyTo(input){
input.select();
document.execCommand("copy");
}
</script>
If <p id="demo"><?php echo $dir ?></p> can repeat many times in the code (due to being contained within a loop) then obviously you can't identify it using a single id, because - by definition - an ID must be unique, and that's not the case here.
You'd need to generate a different ID for each <p> element.
In the simplest case you can just use PHP to add a counter to the ID.
First, outside your loop, initialise a counter:
$i = 0;
Then, within the loop, use that to make a unique element ID:
<p id="demo<?php echo $i; ?>">
<?php echo $dir ?>
</p>
<button onclick="copy('demo<?php echo $i; ?>')">Copy Keeping Format</button> <br><br>
Finally, before your loop ends, increment the counter:
$i++;
I've flexible content based on wordpress page which gives our client opportunities to configure pop-ups in specific page by himselfs.
So the problem is that on one page we've quite a few, let's say infinity numbers of rows of content.
Every specific row has a unique ID created by counting "$i++;".
I'm trying to create a script which will give me the possibility to create unique pop-ups for unique flexible content automatically, based on numbers of current rows.
Here is PHP code
<div class="row">
<?php if( have_rows('service_component') ): $i = 0; ?>
<?php while( have_rows('service_component') ): the_row(); $i++; ?>
<div class="six columns">
<img onclick="openRightMenu()" src="<?php the_sub_field("feature_image"); ?>">
<h3><?php the_sub_field("title"); ?></h3>
<div class="servicesHidden sidenav" id="right_slider_<?php echo $i; ?>">
×
<?php the_sub_field("services"); ?>
</div>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div>
Code above works correctly: content is generated and every div is unique:
<div class="servicesHidden sidenav" id="right_slider_<?php echo $i; ?>">
So next step is to create javascript. Code below also works properly, but only on one unique ID.
<script>
function openRightMenu() {
document.getElementById("right_slider_1").style.width = "33%";
document.getElementById("main").style.marginRight = "33%";
document.body.style.backgroundColor = "rgba(0,0,0,0.4)";
}
function closeRightMenu() {
document.getElementById("right_slider_1").style.width = "0";
document.getElementById("main").style.marginRight = "0";
document.body.style.backgroundColor = "white";
}
</script>
Question is: how to modify function above to to let it display and hide unique content endlessly?
You could pass the id into the function
function openRightMenu(id) {
document.getElementById(id).style.width = "33%";
...
}
And in your html
<img onclick="openRightMenu('right_slider_<?php echo $i; ?>')" src="<?php the_sub_field("feature_image"); ?>">
I have used jquery AJAX to load more posts from MySQL database. It brings up the right content and works just fine.
The only problem is that it displays the data after the first two pictures every time.
Let's say there are 10 pictures in total and the first 2 are already displayed.
image 1
image 2
When the load more button is clicked here is how it looks
image 1
image 2
image 3
image 4
Now if i press the load more button again, here is how it displays the content
image 1
image 2
image 5
image 6
image 3
image 4
If i press it again it will paste the 7 and 8 after the 1 and 2 and so on
Here is my HTML
$rowperpage = 2;
$select_count=mysqli_query($con,"SELECT count(*) as allcount from gif where status = 1");
$select_data=mysqli_fetch_array($select_count);
$allcount=$select_data['allcount'];
$run=mysqli_query($con,"SELECT * FROM gif WHERE status=1 order by id desc limit ".$rowperpage);
if(!$run){
echo mysqli_error($con);
}
while ($row=mysqli_fetch_array($run)) {
$image=$row['gif'];
$id=$row['id'];
$title=$row['title'];
?>
<div class = "load-more-post">
<div class="col-md-3 col-sm-4 col-xs-12" style="margin-bottom:10px;">
<div classs="panel panel-info">
<div classs="panel panel-body ">
<a href='blog.php?gifId=<?php echo $id; ?>'><img src="Uploads/<?php echo $image; ?> " class="img img-responsive img-thumbnail" style='height: 260px; width: 250px; '></a>
</div>
</div>
</div>
</div>
<?php }?>
<h1 class="load-more">Load More</h1>
<input type="hidden" id="row" value="<?php echo $id; ?>">
<input type="hidden" id="all" value="<?php echo $allcount; ?>">
Here is my Javascript
$(document).ready(function(){
// Load more data
$('.load-more').click(function(){
var row = Number($('#row').val());
var allcount = Number($('#all').val());
//row = row + 2;
if(row != 4){
$("#row").val(row);
$.ajax({
url: 'getData.php',
type: 'post',
data: {row:row},
beforeSend:function(){
$(".load-more").text("Loading...");
},
success: function(response){
// Setting little delay while displaying new content
setTimeout(function() {
// appending posts after last post with class="post"
$(".load-more-post").after(response);
//var rowno = row + 2;
var thenewid = Number($('#newid').val());
alert(thenewid);
$("#row").val(thenewid);
// checking row value is greater than allcount or not
if(thenewid == 4){
// Change the text and background
$('.load-more').text("No more posts");
$('.load-more').addClass('inactiveLink');
}
else{
$(".load-more").text("Load more");
}
}, 2000);
}
});
}
});
});
and here is the PHP file where I am getting my datafrom. getData.php
$row = $_POST['row'];
$rowperpage = 2;
// selecting posts
$run=mysqli_query($con,"SELECT * FROM gif WHERE status=1 and id < $row order by id desc limit ".$rowperpage);
if(!$run){
echo mysqli_error($con);
}
while($row = mysqli_fetch_array($run)){
$image=$row['gif'];
$id=$row['id'];
$title=$row['title'];
?>
<div class="col-md-3 col-sm-4 col-xs-12" style="margin-bottom:10px;">
<div classs="panel panel-info">
<div classs="panel panel-body" >
<a href='blog.php?gifId=<?php echo $id; ?>'><img src="Uploads/<?php echo $image; ?> " class="img img-responsive img-thumbnail" style='height: 260px; width: 250px; '></a>
</div>
</div>
</div>
<?php
}?>
<input type="hidden" id="newid" value="<?php echo $id; ?>">
You use
$(".load-more-post").after(response);
to insert your new posts after the .load-more-post div. This particular div is wrapped around your initial posts, so that explains why it gets added there. If you want the oldest always be the last, I'd suggest to use .before instead, like so:
$(".load-more").before(response);
I have a project in which I am displaying a button tag in a while loop. On every button click I want to display an alert box with the respective UserId. Here is my code:
<?php
$data = mysql_query("Select RegisterId,FName,Image1 from Information where RegisterID='$profileMonth1'") or die(mysql_error());
while ($dis1 = mysql_fetch_array($data)) {
?>
<div id="demo1" value="<?php echo "$RegisterId" ?>">
<button onClick="validate()">Show Interest</button>
</div>
<?php } ?>
Here is my validate function:
function validate1(id2)
{
// var id2;
id2 = document.getElementById('demo2').getAttribute('value');
alert(id2);
}
But it is always showing me last user id .. whereas i want to display userid for every user on everyclick.
Can someone help?
Here man, the function you were calling was undefined validate1, also you don't need to get any arguments on your function declaration, since you are not passing any arguments when you invoke it.
<?php
$data = mysql_query("Select RegisterId,FName,Image1 from Information where RegisterID='$profileMonth1'") or die(mysql_error());
while ($dis1 = mysql_fetch_array($data)) {
?>
<div id="demo" value="<?php echo "$RegisterId" ?>">
<button onClick="validate()">Show Interest</button>
</div>
JS
function validate(){
var id2 = document.getElementById('demo').getAttribute('value');
alert(id2);
}
try this in your code
HTML:
<button onClick="validate('<?php echo $RegisterId; ?>')">Show Interest</button>
Javascript:
function validate(id2)
{
alert(id2);
}
Your code needs some modifications.
Firstly, you have made a provision to send id to javascript function, but, you are not passing id to it.
PHP
<?php
$data = mysql_query("Select RegisterId,FName,Image1 from Information where RegisterID='$profileMonth1'") or die(mysql_error());
while ($dis1 = mysql_fetch_array($data)) {
?>
<div id="demo1" value="<?php echo $dis1['RegisterId'];?>">
<button onClick="validate('<?php echo $dis1['RegisterId'];?>')">Show Interest</button>
</div>
<?php } ?>
Javascript:
function validate1(id2) {
// var id2;
//id2 = document.getElementById('demo2').getAttribute('value');
alert(id2);
}
With this code, your clicks shouldn't even return the last id. Your javascript function is not looking good.
This should work;
<?php
$data = mysql_query("Select RegisterId,FName,Image1 from Information where RegisterID='$profileMonth1'") or die(mysql_error());
while ($dis1 = mysql_fetch_array($data)) {
?>
<!-- removed id attribute, as they're unique, you can't set it to every div.
If you really need id attribute, you can set one by using your RegisterId (e.g. id="demo-<?php echo $RegisterId; ?>)
And moved value attribute to button tag, it's much more useful in it. -->
<div>
<button onClick="validate(this)" value="<?php echo "$RegisterId" ?>">Show Interest</button>
</div>
<?php } ?>
Javascript
function validate(element){
alert(element.value)
}
This way, you can use it in other stuff much easier.
I have products in table I wish to display some when page load and remain data should display on button click, I have set limit as 6 per page, when page loading it is displaying first six rows and if I click on Load More button it is displaying another six rows here problem coming after got 12 rows from table when I click again on Load More button it is not working even I have more data in table, I have cross checked parameters also, it is fine parameters also sending with request. please help me how to solve this.
NOTE: when I test this script in core php it is working fine, when I implement this script in codeigniter first time click load more data working second time when i click it is not wokring.
Javascript Code Block
$('.more').click(function(){
var ID = $(this).attr("id");
var cats = $('input[name=cats]').val();
$("#more"+ID).html('<img src="<?=ROOT;?>resources/moreajax.gif" />');
$.post('<?=ROOT;?>product/dataLoad', {id:ID,cats:cats}, function(data){
if(data)
{
$('ol#updates').append(data);
$("#more"+ID).remove();
}
else
{
$(".morebox").html('The End');// no results
}
});
return false;
});
codeigniter controller function
public function dataLoad() {
if(isset($_POST['id']))
{
$lastmsg=$_POST['id'];
$cats = $_POST['cats'];
$query=mysql_query("select * from product where id > '".$lastmsg."' AND category_id IN ($cats) order by id asc limit 4");
$numrows = mysql_num_rows($query);
while($ob = mysql_fetch_array($query))
{
?>
<div>
<p>ID: <?=$ob['id']; </p>
<p>NAME: <?=$ob['name']; </p>
</div>
<?php
}//while
?>
<?php
if($numrows > 0)
{
?>
<div id="more<?php echo $ob['id']; ?>" class="morebox" style="clear:both">
<input type="hidden" name="cats" value="<?=$cats;?>" />
Load More
</div>
<?php
}
}
?>
product page code
<ol class="timeline" id="updates">
$str = implode(",",$cats);
$query = "select * FROM product WHERE category_id IN (".$str.") order by id asc limit 4";
$result=mysql_query($query);
$numrows = mysql_num_rows($result);
while($ob = mysql_fetch_array($result))
{
?>
<div>
<p>ID: <?=$ob['id']; </p>
<p>NAME: <?=$ob['name']; </p>
</div>
<?php
}//while
?>
</ol>
<?php
if($numrows > 0)
{
?>
<div id="more<?php echo $ob['id']; ?>" class="morebox" style="clear:both">
<input type="hidden" name="cats" value="<?=$cats;?>" />
Load More
</div>
<?php
}
?>
I solved this problem insted of this
$('.more').click(function(){
$("#updates").on("click",".more",function(){