How to get dropdown dynamically with ul li inside ul using php? - php

I have a ul li with parentid . I want all ul li with parentid but I'm getting multiple loops. The first steps and last are under same parentid.
<ul class="section-list">
<?php
if(count($outArrResults)>0){
for($i=0; $i<count($outArrResults); $i++){
?>
<li class="o-view">
<a href='javascript:void(0);'>
<h4 class="tit-section xsm">
<?php echo isset($outArrResults[$i]['cName']) ?$outArrResults[$i]['cName'] : '';?>
</h4>
</a>
<ul>
<?php
for($s=0; $s<count($outArrResults); $s++){
$contentSlugUrl = isset($outArrResults[$s]['conSName']) ? $outArrResults[$s]['conSName']:'';
$contentMenuTitle = isset($outArrResults[$s]['conMTitle']) ? $outArrResults[$s]['conMTitle']:'';
if($contentMenuTitle!=''){
?>
<li>
<a href='<?php echo $config['LIVE_URL'].'courses/'.$pAction1.'/'.$pAction2.'/'.$contentSlugUrl;?>'>
<span><?php echo $contentMenuTitle;?></span>
</a>
</li>
<?php
}
}
?>
</ul>
</li>
<?php
}
} else {
echo "No Results";
}
?>

Related

Displaying each two array items in one loop item with right placement

I am trying to do something fit with the design, so i have to show 2 item in 1 loop. Also, according to this design, should be line break in each 4 loop. Line breaks applying automatically, but its fixed 4. So, in 4 loop it shows actually 8 items. However, the point I'm stuck on is; items are not displaying in the placement I want. You can see the placement I want to do with more detail in the picture.
Red Numbers = Current placement
Green Numbers = Placement it should be
Yellow boxes = For loop items ( 8 items )
Black boxes = Items in array (16 items )
.
ul,li {
padding:0;
margin:0;
list-style:none;
}
li {
width:30px;
}
.gen {
width: 140px
}
li {
display: inline-block;
}
.ic {
width: 100%
}
<ul class="gen">
<li>
<ul>
<li class="ic">a</li>
<li class="ic">b</li>
</ul>
</li>
<li>
<ul>
<li class="ic">c</li>
<li class="ic">d</li>
</ul>
</li>
<li>
<ul>
<li class="ic">e</li>
<li class="ic">f</li>
</ul>
</li>
<li>
<ul>
<li class="ic">g</li>
<li class="ic">h</li>
</ul>
</li>
<li>
<ul>
<li class="ic">i</li>
<li class="ic">j</li>
</ul>
</li>
<li>
<ul>
<li class="ic">k</li>
<li class="ic">l</li>
</ul>
</li>
<li>
<ul>
<li class="ic">m</li>
<li class="ic">n</li>
</ul>
</li>
<li>
<ul>
<li class="ic">o</li>
<li class="ic">p</li>
</ul>
</li>
</ul>
As you can see, items are not placing alphabetically from left to right.
Here is the loop i used :
// 16 items
$items = array('a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p');
$half = count($items) / 2;
$k = 0;
echo '<ul class="gen">';
for($i = 0; $i<$half; $i++) {
echo '<li>';
echo '<ul>';
echo '<li class="ic">'.$items[$k].'</li>';
echo '<li class="ic">'.$items[$k+1].'</li>';
echo '</ul>';
echo '</li>';
$k = $k+2;
}
echo '</ul>';
I hope this helps. You can run this code and see the output.
// chaganged the array to match your picture.
$items = array('1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16');
//used to format the output
echo "<pre>";
for ( $i = 0; $i<count($items) ; $i++ ) {
echo "loop start \n";
// access 1st item
echo $items[$i]."\n";
// based on your example, it seems that you need the item that is 4 places after the first item of the loop
echo $items[$i+4]."\n";
echo "loop end\n";
// we can use mod to check if we have reached the 4th element (index 3), we use $i+1 to check the second element of the loop
if ( ( $i+1 )%4 == 0 ) {
echo "\n---new line---\n";
$i = $i + 4;
}
echo "\n";
}
echo "</pre>";
Assuming that you will take care of the formatting, your code could be changed to this:
$items = array('a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p');
for($first = 0; $first < count($items); $first += 8) {
for($add = 0; $add < 4; $add++) {
echo $items[$first + $add]; //first item
echo $items[$first + $add + 4]; //second item
}
}
May I see your HTML code? Here's a suggestion, display your results like this (run code snippet and use my css and php loop);
#wrapper{
background-color:rgba(0,0,0,0.6);
padding:10px;
}
.result{
display:inline-block;
padding:7px;
border:3px solid #FEBF01;
width:120px;
}
.result-child{
display:block;
padding:10px 10px;
background-color:rgba(0,0,0,0.8);
color:rgba(50,255,100,1);
font-size:2em;
text-align:right;
}
.result .result-child:first-of-type{
margin-bottom:10px;
}
<div id="wrapper">
<div class="result">
<div class="result-child">1</div>
<div class="result-child">1</div>
</div>
<div class="result">
<div class="result-child">2</div>
<div class="result-child">2</div>
</div>
</div>
Loop code:
for($i = 0; $i<$half; $i++) {
echo "<div class='result'>";
echo "<div class='result-child'>".$items[$k]."</div>"; //first item
echo "<div class='result-child'>".$items[$k+1]."</div>"; //second item
echo "</div>";
$k = $k+2;
}

Add css class to list items except last in jQuery

I have an unordered list which values are generated from a database using php and mysql.
<div id="articles">
<ul>
<?php foreach ($articles as article) { ?>
<li> <?php echo $article['name']; ?> </li>
<?php } ?>
</ul>
</div>
I'd like to use jQuery to add a css class to every item in that list except the last one
//then you can select all `li` elements under `#articles` except the last one like
jQuery(function($) {
$('#articles li:not(:last)').addClass('myclass')
})
.myclass {
background-color: lightgrey;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="articles">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
You can do it with css only
#articles li {
background-color: lightgrey;
}
#articles li:last-child {
background-color: white;
}
<div id="articles">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
<div id="articles">
<ul>
<?php
$count =count($articles);
foreach ($articles as article) {
$counter++;
If($count==$counter)
$class='something';
Else
$class='';
?>
<li> <?php echo $article['name']; ?> </li>
<?php
}
?>
</ul>
</div>
Use class variable in li now.
You can achieve same thing using PHP also by adding one more condition in your code.
foreach ($articles as $article) {
if(end($articles) == $article) {
?>
<li> <?php echo $article['name']; ?> </li>
<?php
}
else{ ?>
<li class="myclass"> <?php echo $article['name']; ?> </li>
<?php
}
}

menu by default should hidden

Hey guys i want the sensor to be hidden by default and it show when i click on the particular node..and should be the same on page reload
Here is my code
<ul >
<?php if(isset($nodes)): ?>
<?php $count = 0; ?>
<?php foreach($nodes as $node) { ?>
<?php $node_id=$node['node_id']; ?>
<?php $sensors = config_sensor_model::getsensors($node_id); ?>
<?php $count++; ?>
<li onclick="menu(<?php echo $count; ?>)"><?php echo $node['node_name']; ?> </li>
<ul id="<?php echo "sub_".$count; ?>">
<?php foreach($sensors as $sensorlog) { ?>
<li> <?php echo $sensorlog->sensor_name; ?></li>
<?php } ?>
</ul>
<?php } ?>
<?php endif; ?>
</ul>
</div>
this is the javascript presently i am using
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
function menu(count)
{
$("#sub_"+count).toggle("fast");
}
</script>
As mentioned in my comment just use CSS to hide the node initially like this:
<style type="text/css">
.hidden { display: none; }
</style>
<ul>
if(isset($nodes)):
$count = 0;
foreach($nodes as $node) {
$node_id = $node['node_id'];
$sensors = config_sensor_model::getsensors($node_id);
$count++;
?>
<li onclick="menu(<?php echo $count; ?>)"><?php echo $node['node_name']; ?> </li>
<ul id="<?php echo "sub_".$count; ?>" class="hidden">
<?php foreach($sensors as $sensorlog) { ?>
<li> <?php echo $sensorlog->sensor_name; ?></li>
<?php } ?>
</ul>
<?php }
endif; ?>
</ul>
</div>
When menu is clicked, the display value will be toggled by Javascript.
Set style='display:none' for the <ul>

PHP foreach sorting every 9 items into lists and divs

Im currently struggle with sorting a foreach loop into its own div's and ul's, heres what i have currently:
<ul class="thumbnails parts-page">
<?php $show = false; ?>
<?php foreach ($this->items as $item) : ?>
<?php if($item->state == 1 || ($item->state == 0 && JFactory::getUser()->authorise('core.edit.own',' com_parts'))):
$show = true;
?>
<li class="span4">
<a href="<?php echo $item->brand_link; ?>" style="background:url(<?php echo $item->brand_image; ?>) no-repeat center center #FFF; " class="thumbnail parts" target="_blank">
</a>
</li>
<?php endif; ?>
<?php endforeach; ?>
</ul>
basically this produces:
<ul class="thumbnails parts-page">
<li class="span4">
<a href="http://www.canecreek.com/" style="background: url('/torqzone/images/brands/cane-creek.png') no-repeat center center #FFF; " class="thumbnail parts" target="_blank">
</a>
</li>
<li class="span4">
<a href="http://www.amclassic.com/en/" style="background: url('/torqzone/images/brands/american-classic.png') no-repeat center center #FFF; " class="thumbnail parts" target="_blank">
</a>
</li>
<li class="span4">
<a href="http://www.avid.com/US/" style="background: url('/torqzone/images/brands/avid.png') no-repeat center center #FFF; " class="thumbnail parts" target="_blank">
</a>
</li>
</ul>
but i need to split it so that every 9 items is in its own:
<ul class="thumbnails parts-page">
9ITEMS
</ul>
I have tried various solution that i found online but nothing seems to work..
Any Help Greatly Appreciated.
A very easy and readable solution is to use array_chunk:
<?php foreach (array_chunk($this->items, 9) as $items): ?>
<ul>
<?php foreach ($items as $item): ?>
<!-- your code -->
<?php endforeach; ?>
</ul>
<?php endforeach; ?>
Yes it's an extra loop, but so much more readable.
Use something like this:
echo '<ul ...>';
$i = 0;
foreach ( ...... ) {
if (++$i % 9 == 0) echo '</ul><ul ....>';
// your code here
}
echo '</ul>';
Set a variable equal to 1. increment it every time you run your loop. If its > 9, create a new ul, else add it to the old ul.
<?php
$i=0;
foreach ($this->items as $item) : ?>
<?php if($item->state == 1 || ($item->state == 0 && JFactory::getUser()->authorise('core.edit.own',' com_parts'))):
$show = true;
++$i;
?>
<li class="span4">
<a href="<?php echo $item->brand_link; ?>" style="background:url(<?php echo $item->brand_image; ?>) no-repeat center center #FFF; " class="thumbnail parts" target="_blank">
</a>
</li>
<?php if($i>8): $i=0; ?>
</ul><ul class="thumbnails parts-page">
<?php endif; ?>
<?php endif; ?>
<?php endforeach; ?>
instead of above code replace this
How about using a counter variable?
$counter = 0;
<?php $show = false; ?>
<?php foreach ($this->items as $item) : ?>
<?php if ($counter % 9 == 0)
echo '<ul class="thumbnails parts-page">';?>
<?php if($item->state == 1 || ($item->state == 0 && JFactory::getUser()->authorise('core.edit.own',' com_parts'))):
$show = true;
?>
<li class="span4">
<a href="<?php echo $item->brand_link; ?>" style="background:url(<?php echo $item->brand_image; ?>) no-repeat center center #FFF; " class="thumbnail parts" target="_blank">
</a>
</li>
<?php endif; ?>
<?php if ($counter % 9 == 0)
echo '</ul>';?>
<?php $counter +=1 ?>
<?php endforeach; ?>
In this way you will print the ul tags every 9 items of your list (putting them inside).
(PLease test the code since I do not have a environment for it right now)
The easiest way for you to accomplish this is to create a counter that goes up by one every time. For example at the start of your code declare $count and the in your for each statement say $count++. You can then create a IF statement that says if the count is 9, create the new UL.
Seems like people are trying to make this too complicated.
From your what I understand is you want is every unordered list must contain only 9 items.. If thats the case you can use a count variable
<?php $show = false; $count=0; ?>
<?php foreach ($this->items as $item) : ?>
<?php if($item->state == 1 || ($item->state == 0 && JFactory::getUser()->authorise('core.edit.own',' com_parts'))):
$show = true;
?>
<?php if($count%9==0) echo'<ul class="thumbnails parts-page">'; ?>
<li class="span4">
<a href="<?php echo $item->brand_link; ?>" style="background:url(<?php echo $item->brand_image; ?>) no-repeat center center #FFF; " class="thumbnail parts" target="_blank">
</a>
</li>
<?php if($count%9 ==0) echo '</ul>'; ?>
<?php $count++; ?>
<?php endif; ?>
<?php endforeach; ?>
</ul>

CSS Dropdown menu through PHP, logic defeats me

My brain doesn't seem to want to work this morning.. i have the following array:
private $nav_pages = [['0', 'Home', 'home'],
['0', 'About Us', 'about'],
['0', 'Our Services', 'services'],
['1', 'PROCURE TO PAY (P2P)', 'procure'],
['1', 'ORDER TO CASH (02C)', 'cash'],
['1', 'GENERAL ACCOUNTING', 'general'],
['2', 'Charting of Accounts', 'charting'],
['2', 'General Ledger Maintenance', 'maintenance'],
['2', 'Accounts Receivable Services', 'receivable'],
['2', 'Accounts Payable Services', 'payable'],
['2', 'Reconciliation of Bank Accounts and Credit Cards', 'reconciliation'],
['2', 'Preparing Financial Statements', 'statements'],
['2', 'Payroll Processing', 'payroll'],
['1', 'CLOSING & REPORTING', 'closing'],
['0', 'How It Works', 'how-it-works'],
['0', 'Contact Us','contact'],
['0', 'Careers', 'careers']];
This is then fed to a php page which is meant to lay out a multi-layered pure css drop down menu.. the php page code is:
<ul class="<?php echo $ul_class; ?>">
<?php $this_layer = 0;
// place array content into variables
foreach ($links as $link) {
$item_layer = $link[0];
$item_string = $link[1];
$item_link = $link[2];
if ($item_layer > $this_layer) { ?>
<ul>
<?php $this_layer++; }
elseif ($item_layer == $this_layer) { ?>
<li class="<?php echo $item_link; ?>">
<a class="<?php echo $item_link; ?>"
href="/<?php echo $item_link; ?>">
<?php echo $item_string; ?>
</a>
</li>
<?php }
elseif ($item_layer < $this_layer) { ?>
</li></ul>
<?php $this_layer--; } ?>
<?php } ?>
The output is not correct however as the above code always closes the list item containing the second layer before the second layer is ready to be closed. if that makes sense..
<ul class="pages_nav">
<li class="home">
<a class="home"
href="/home">
Home
</a>
</li>
<li class="about">
<a class="about"
href="/about">
About Us
</a>
</li>
<li class="services">
<a class="services"
href="/services">
Our Services
</a>
</li>
<ul>
<li class="cash">
<a class="cash"
href="/cash">
ORDER TO CASH (02C)
</a>
</li>
<li class="general">
<a class="general"
href="/general">
GENERAL ACCOUNTING
</a>
</li>
<ul>
<li class="maintenance">
<a class="maintenance"
href="/maintenance">
General Ledger Maintenance
</a>
</li>
<li class="receivable">
<a class="receivable"
href="/receivable">
Accounts Receivable Services
</a>
</li>
<li class="payable">
<a class="payable"
href="/payable">
Accounts Payable Services
</a>
</li>
<li class="reconciliation">
<a class="reconciliation"
href="/reconciliation">
Reconciliation of Bank Accounts and Credit Cards
</a>
</li>
<li class="statements">
<a class="statements"
href="/statements">
Preparing Financial Statements
</a>
</li>
<li class="payroll">
<a class="payroll"
href="/payroll">
Payroll Processing
</a>
</li>
</li></ul>
</li></ul>
<li class="contact">
<a class="contact"
href="/contact">
Contact Us
</a>
</li>
<li class="careers">
<a class="careers"
href="/careers">
Careers
</a>
</li>
SOLUTION:
<ul class="<?php echo $ul_class; ?>">
<?php $this_layer = 0;
// place array content into variables
foreach ($links as $link) {
$item_layer = $link[0];
$item_string = $link[1];
$item_link = $link[2];
// check if link needs to be manipulated
switch($do) {
case 'strtolower':
$item_string = strtolower($item_string);
break;
case 'strtoupper':
$item_string = strtoupper($item_string);
break;
} ?>
<?php if ($item_layer > $this_layer) { ?>
<ul>
<li class="<?php echo $item_link; ?>">
<a class="<?php echo $item_link; ?>"
href="/<?php echo $item_link; ?>">
<?php echo $item_string; ?>
</a>
<?php $this_layer++; }
elseif ($item_layer == $this_layer) { ?>
</li><li class="<?php echo $item_link; ?>">
<a class="<?php echo $item_link; ?>"
href="/<?php echo $item_link; ?>">
<?php echo $item_string; ?>
</a>
<?php }
elseif ($item_layer < $this_layer) { ?>
</li></ul></li><li class="<?php echo $item_link; ?>">
<a class="<?php echo $item_link; ?>"
href="/<?php echo $item_link; ?>">
<?php echo $item_string; ?>
</a>
<?php $this_layer--; } ?>
<?php } ?>
Never close the the li tag, close it when you add something
foreach ($links as $link) {
if ($item_layer > $this_layer) {
echo '<ul><li> ......';
this_layer++;
}elseif ($item_layer == $this_layer) {
echo '</li><li>......';
}elseif ($item_layer < $this_layer) {
echo '</li></ul><li>......';
$this_layer--;
}
}
Last you probably need to add a echo '</li></ul>' outside of the foreach to close everything
Had to rework the code a little, usually i organize the php menu structure in tree form makes it easier to parse into html menus, but here it is:
<ul class="<?php echo $ul_class; ?>">
<?php
$this_layer = 0;
$closeit = false;
// place array content into variables
foreach ($nav_pages as $link) {
$item_layer = $link[0];
$item_string = $link[1];
$item_link = $link[2];
if ($item_layer > $this_layer) {
// Changing level, dont close the previous li
?><ul><?php
$closeit = false;
$this_layer++;
}
if ($item_layer == $this_layer) {
// Same level, check if you need to close previous li
if ($closeit) {
?></li><?php
}
// Render the li
?>
<li class="<?php echo $item_link; ?>">
<a class="<?php echo $item_link; ?>"
href="/<?php echo $item_link; ?>">
<?php echo $item_string; ?>
</a>
<?php
// Close it on next loop
$closeit = true;
}
elseif ($item_layer < $this_layer) {
// Changing layer back down, close the previous li and the current level ul
?>
</li>
</ul>
<?php
$this_layer--;
}
}
// Finished loop, there should still be a li waiting to be closed
if ($closeit) {
?></li><?php
}
// Close menu
?>
</ul>
Should be working, let me know if it isnt
Suggested php menu structure:
$menu = array(
array(
"url"=>"/place.php",
"text"=>"Go to place"
),
array(
"url"=>"/place2.php", // not necessary
"text"=>"with submenu",
"children"=>array(
array(
"url"=>"/placewithinplace2.php",
"text"=>"submenu item"
)
)
)
);

Categories