Bootstrap not aligning divs with Ajax and SQL - php

I installed this script:
https://www.webslesson.info/2017/03/load-content-while-scrolling-with-jquery-ajax-php.html
it works well but I have a problem with Bootstrap I can't align the columns
I modified the code in the while loop with this:
echo '<div class="border box col-3 m-1 mx-auto p-2 rounded text-center">';
echo ' <span>'. $row['post_title'] .'</span> <br />';
echo '<span class="small">'. $row['post_description'] .'<br />'. $row['post_author'] .'</span>';
echo '</div>';
And I modified the index.php file to add two divs with a class 1 container & 1 row
In theory the result should look like this:
Result.1 | Result.2 | Result.3 | Result.4
Result.5 | Result.6 | Result.7 | Result.8
etc ...
But instead I have this:
Result.1
Result.2
Result.3
Result.4
etc ...
I'm looking for it but I can't find where the problem comes from when I test in HTML without PHP & AJAX the divs are displayed well next to each other and not below each other so the problem lies elsewhere.

Related

PHP give a different class if there is more than an amount of blocks

I've been working on a website and it has 5 blocks. When the screen gets smaller I need to get 2 of the blocks under the other 3 and they get a different with so i gave them another class.
Im trying to get it into a CMS and i have to use this code down below.
Now is my question how do i make this happen with if i want the user to be able to edit the blocks. I've tried to make some edits in the script but so far no succes. I need to add a different class to block nr 4 and 5. What is a good way to do this?
<div class="colums">
<?php
$i=1;
//krsort($properties['blocks']);
foreach($properties['blocks'] as $block)
{
echo '<div class="colum1" id="pic'.$i.'" style="background-image:url(/uploaded/overige/'.$block['image2'].');">
<div class="content_colum">
<div class="wilpe_logo">
<img src="/uploaded/overige/'.$block['image'].'" alt="" />
</div>
<div class="text_holder">
'.$block['text'].'
<div class="button_two">
<a class="button_text" href="'.$cms->make_link($block['link']).'">'.$block['linktext'].'</a>
</div>
</div>
</div>
</div>';
$i++;
}
?>
</div>
Colum1 needs to be colum2 if there is 3 colum1's
I've found the answer in another question. I made the question smaller and more understandable and this is the answer that came out:
$i = 1;
foreach($properties['blocks'] as $block)
{
echo '<div class="' . ($i < 4 ? 'colum1' : 'colum2') . '" id="pic'.$i.'" style="background-image:url(/uploaded/overige/'.$block['image2'].');">
// --------------
Stackoverflow answer
Posted it here to share with everyone.

How to customize wordpress portfolio grid to replace attributes output with text of single portfolio?

I am a php newbie but have to resolve the following issue in some way:
In my …portfolio_grid.php I succeeded in understanding that this part:
$output .= '
<a class="classic-portfolio-box normal-type-prt'.$colorize_fx_class.'" href="'.get_permalink($post_id).'" title="'.get_the_title().'"'.$colorize_hover.'></a>
<div class="portfolio-box">
<div class="portfolio-naming">
<h2 class="portfolio-title">'.get_the_title().'</h2>';
if( !empty($on_attributes) ){
$output .= '
<h3 class="portfolio-attributes">'.$on_attributes.'</h3>';
}
$output .= '</div>
</div>
<img src="'.$image[0].'" width="'.$image[1].'" height="'.$image[2].'" alt="'.get_the_title().'" />
';
is responsible for what appears in my portfolio boxes. Now I’d like to change the following detail:
$output .= '
<h3 class="portfolio-attributes">'.$on_attributes.'</h3>';
Instead of the content of the $on_attributes variable I’d like to put out the content of the single portfolios texts field instead. I bet this is possible.
How can I fetch the content of the text field of each single portfolio post and put it out there? I know that somehow the the_content() or get_the_content() function will play a role but how is it to be done exactly? Any help is appreciated!
You already mentioned the answer in your question:
'<h3 class="portfolio-attributes">' . get_the_content() . '</h3>';
This assumes the the "text of a portfolio item" is actually saved as the WP content in your database.
As a side note, I'm not sure why you're concatenating everything as a string in this case...A wonderful thing about PHP is the ability to weave it in with standard HTML:
<h3 class="portfolio-attributes"><?php the_content(); ?></h3>

Linking or scrolling to Specific scetion in PHP when using dynamic div id

In HTML we can create A single page site with smooth scrolling, and highlighted navigation links depending on which section is currently being viewed.To do the above in HTMl we
link to this point (e.g. from the top of the page), we link using the hash character (#) and the name of the destination anchor:
Go To Contact Form
The same I am Trying to Implement in PHp but I am facing Issues.
<div class="wrap">
<div class="main">
<div class="open-positions">
<?php
function readCSV($fileName) {
$rows = array();
$rows = file($fileName);
return $rows;
}
?>
<span><b>Available Positions: </b></span>
<ul>
<?php
$rows=readCSV('joinUs.csv');
$max = sizeof($rows);
for ($x=1; $x<$max; $x++) {
echo "<li> <a href='#".$rows[$x]."'>$rows[$x] |</a> </li>";
}
?>
</ul>
<div class="position" id="<?php print_r(readCSV('joinUs.csv')[1]);?>">
Job Descreption here
</div>
The Anchor Id seen while inspecting is Sr. Product Engineer and $rows[$x] is Sr. Product Engineer and both are same still Its not scrolling(from top of site on clicking the Click).
When I am hardcoding to Sr. Product Engineer it Its Working. It not working only in case of dynamic div id.While Inspecting in browser I am able to see correct div ID.
How to fix the above issue.
please let me know if any other clarification is required.
Attached is the ScreenShot
I was Requested in comment to post html source code also:
<span><b>Available Positions: </b></span>
<ul>
<li> <a href='#Sr. Product Engineer
'>Sr. Product Engineer
|</a> </li><li> <a href='#Quality Assurance Engineer
'>Quality Assurance Engineer
|</a> </li><li> <a href='#Frontend Javascript Engineer
'>Frontend Javascript Engineer
|</a> </li><li> <a href='#Business Development Manager
'>Business Development Manager
|</a> </li> </ul>
</div>
<div class="position" id="Sr. Product Engineer
">
<h2 class="position-title">Sr. Product Engineer
</h2>
<div class="section">
<p>
<span class="section-title"><b>This is what we have in mind for you, the Role:</b></span>
<span class="section-description">
You will be part of the tech team and will be working closely with founders
and design team on the core product. You will be working to build new features,
fix bugs and refactor things as necessary.
</span>
</p>
<p>
<ul class="section-list">
<li>Responsible for the tech architecture</li>
<li>Take ownership of things</li>
<li>Write simple/readable code which is testable, extendable, robust and highly scalable</li>
<li>Help getting new joinees upto speed with the product</li>
<li>Suggest new features, priorities tasks and see to their completion</li>
</ul>
</p>
</div>
Please help as in above source code you can see PHP generates the same ID in html.When I am hardcoding the id It working but without hardcoding its not working.
Use valid IDs without dots or spaces or any other special characters.
<a href='#SrProductEngineer'>Sr. Product Engineer</a>
<h3 id="SrProductEngineer">Sr. Product Engineer</h3>
To generate that dynamically with PHP:
<?php
$str = readCSV('joinUs.csv')[1];
$id = preg_replace('/[^A-Za-z0-9]/', '', $str); // Remove all characters except A-Z, a-z, 0-9
echo '' . $str . '';
echo '<h3 id="' . $id . '">' . $str . '</h3>';
?>
Inside the loop, just name the id's as
position_0, position_1, position_2
and then anchor them using
#position_0, #position_1, #position_2

cakephp 1.3, how to use Paginator->sort() for two columns?

i have a simple application where i view some posts from a database and i use Paginator->sort to sort.
What i did is i duplicate everything so that i show the posts twice as well as the sorting.
something like this:
link_sort
post1
post2
post3
link_sort
post1
post2
post3
But when i click link_sort both post display get sorted, and i could see that because they are the same. But how can i make it unique so that one link sorts one post display and another one the other one :).
here is some code:
<div class="sort"><?php echo $this->Paginator->sort('title');?></div>
<div class="sort"><?php echo $this->Paginator->sort('body');?></div>
<div class="content_title"><?php echo $post['Post']['title']; ?></div>
<div class="content_body"><?php echo $post['Post']['body']; ?></div>
<div class="sort"><?php echo $this->Paginator->sort('title');?></div>
<div class="sort"><?php echo $this->Paginator->sort('body');?></div>
<div class="content_title"><?php echo $post['Post']['title']; ?></div>
<div class="content_body"><?php echo $post['Post']['body']; ?></div>
any ideas?
thanks
I think this will work -
create two different variables in the controller:
$paginate1 = $this->paginate('conditions...')
$paginate2 = $this->paginate('conditions...')
if am not mistaken I had a similar problem once and this is how I solved it.

php echoing <div> in wrong place

i am working on an an options panel for a wordpress theme. this problem has started since i tried trying to add jquery, but it doesn't seem like it should be a jquery problem.. and doesn't go away when i delete all my jquery scripts.
anyway PHP determines whether the page was saved, reset, etc and displays an appropriate message at the top of the page. but for some reason, my div (Which ought to appear first) is appearing after my h2 in the #info div that is several lines below. it isn't a css abs positioning issue as when i view source the #message div is contained w/in #info even though it appears first in the and as far as i can tell all my div tags are opened and closed correctly. this behavior resolves if i get rid of the 'updated' class. i don't desperately need to maintain that class (i can just create a new one w/ similar attributes) but i am baffled as to why the heck the php is firing incorrectly.
<?php
if ($_REQUEST['saved']) {
echo '<div id="message" class="updated fade"><p><strong>' . $my_themename . ' ' . __('settings saved.', 'thematic') . '</strong></p></div>';
}
if ($_REQUEST['reset']) {
echo '<div id="message" class="updated fade"><p><strong>' . $my_themename . ' ' . __('settings reset.', 'thematic') . '</strong></p></div>';
}
if ($_REQUEST['reset_widgets']) {
echo '<div id="message" class="updated fade"><p><strong>' . $my_themename . ' ' . __('widgets reset.', 'thematic') . '</strong></p></div>';
}
if ($_REQUEST['error']) {
echo '<div id="message" class="updated fade"><p><strong>The file you submitted was not a valid image type.</strong></p></div>';
}
if ($_REQUEST['imgremoved']) {
echo '<div id="message" class="updated fade"><p><strong>'. __('Image Removed') .'</strong></p></div>';
}
if ($_REQUEST['imgsaved']) {
echo '<div id="message" class="updated fade"><p><strong>'. __('Image Uploaded') .'</strong></p></div>';
}
?>
<div id="saved"></div>
<div id="header" class="clearfix">
<div id="themelogo"><img src="<?php echo CHILDTHEME_URI .'/functions/css/images/logo.png';?> " / ></div>
<div id="info">
<h1><?php echo $my_themename; ?></h1>
<h2>Built on the Thematic Theme Framework</h2>
</div>
</div>
Not really a solution for the reported behaviour, but noticed a small section of code which may be better expressed differently:
<div id="themelogo"><img src="<?php echo CHILDTHEME_URI .'/functions/css/images/logo.png';?> " / ></div>
Might be better as:
<div id="themelogo"><img src="<?php echo CHILDTHEME_URI; ?>'/functions/css/images/logo.png" /></div>
Just one of those things - I am used to debugging code by reading it and trying to optimise it as I go. I presume the affected file is not available anywhere online for us to review and see the error for ourselves?
One thing that might be worth looking into is whether you are including css files from the jqueryui library. I know I have on several occasions experienced formatting issues when including that css.

Categories