I have do a pagination with php&html,the problem is my $page is always equal 1 even I click another page and the url is already become ?page=2.The value $p cannot pass as $page.How can I solve this?
<ul class="nospace clear" style="width:1310px;">
<?php
if(isset($_GET['page'])&& $_GET['page']!=""){$page = $_GET["page"];}else{$page=1;}
$current=$page;
$end=12;
if($page=1){$start=0;$previous=$page;$next=$page+1;}
else if($page<=12){$start=$page*12-12;$previous=$page-1;$next=$page+1;}
else{$start=0;$previous=$page-1;$next=12;}
$sql = "Select * from item where Gender='women' AND Category='cloth' LIMIT $start,$end";
$result = mysqli_query($connect,$sql);
while($row=mysqli_fetch_assoc($result)){?>
<img src="../images/demo/<?php echo $row["Pic"]; ?>" style="width:300px;height:280px"><br><p></p><h3><strong><?php echo $row["Name"]; ?></strong></h3><p><?php echo $row["Description"]; ?></p></li>
<?php } ?></ul><figcaption>Page <?php echo"$page ";?> end...</figcaption>
</figure>
</div>
<nav class="pagination">
<ul>
<li>« Previous</li>
<?php
for ($p=1;$p<13;$p++){
if ($page == $p) {?>
<li class="current btn1"><strong><?php echo $p ?></strong></li><?php }
else{?><li><a href="?page=<?php echo $p ?>" class='btn1'><?php echo $p ?></a></li><?php }}?>
<li> Next » </li>
</ul>
I'm working on moving some nav items around on an exiting site but am unfamiliar with php (though I assumed this would just me a css issue). The issue is that some of the nav items are underlined correctly when clicked (active) while other are not.
I've tried working with the code outside of the site but because it is also php I cant get it to render properly in the browser
#main_nav .active{
text-decoration: underline!important;
}
<nav id="main_nav" class="nav-mobile col-md-8 col-md-pull-4 col-md-float-break">
<ul>
<li id="home_link"><a href="/<?php echo $data['lang']['language']; ?>" <?php if ($data['page_info']['disc'] == 'home') echo 'class="active"'; ?> ><?php echo $data['lang']['home_link']; ?></a></li>
<li id="started_link"><a href="/<?php echo $data['lang']['language']; ?>/get-started" <?php if ($data['page_info']['disc'] == 'get_started') echo 'class="active"'; ?> ><?php echo $data['lang']['started_link']; ?></a></li>
<li id="new_vehicle_link"><a href="/<?php echo $data['lang']['language']; ?>/lease-or-purchase" <?php if ($data['page_info']['disc'] == 'lease-or-purchase') echo 'class="active"'; ?> ><?php echo $data['lang']['new_vehicle_link']; ?></a></li>
<li id="keep_vehicle_link"><a href="/<?php echo $data['lang']['language']; ?>/purchase-your-vehicle" <?php if ($data['page_info']['disc'] == 'purchase-your-vehicle') echo 'class="active"'; ?> ><?php echo $data['lang']['keep_vehicle_link']; ?></a></li>
<li id="vehicle_link"><a href="/<?php echo $data['lang']['language']; ?>/turn-in-your-vehicle" <?php if ($data['page_info']['disc'] == 'turn_in_your_vehicle') echo 'class="active"'; ?> ><?php echo $data['lang']['vehicle_link']; ?></a></li>
</ul>
</nav>
It's because you switch from dashes to underscores.
get-started -> get_started
turn-in-your-vechicle -> turn_in_your_vehicle
These will never match, so they will never be active
I have a php/mysql driven menu. I am trying to add an active class to the menu item whenever the URI reflects that menu item (basically, when I am on that page) but every example I find is with a menu that is not populated through an array or repeater like mine.
How can manipulate the active class you see below so that it shows only when I am on that page?
Here is my menu
<?php
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
if($row['id'] == 2){
// below is the active class that is now being populated accross all items equally
echo '<li class="nav-item dropdown active">';
echo '<a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="services">';
echo $row["pagename"];
echo '<i class="zmdi zmdi-chevron-down"></i>';
echo '</a>';
// create a new list
echo '<ul class="dropdown-menu">';
// loop second/submenu query results
while($sub_row = $result2->fetch_assoc()) {
echo '<li>';
echo '' . $sub_row["pagename"] . '';
echo '</li>';
}
echo "</ul>";
echo '</li>';
} else { // for all other menu links
echo '<li class="nav-item dropdown active">';
echo '' . $row["pagename"] . '';
echo '</li>';
}
}
} else {
echo "0 results";
}
?>
The screenshot below shows the result after it renders. Notice the active class highlighted in yellow, it is added to every item in my main menu (the way I have it coded, which it's wrong of course). The green is the $sub_row["link"] (to answer Mark's question below
Notice, the active class is only needed to be added programmatically on the main menu. (the else portion of my code).
The screenshot below shows how the active class affects the menu item if the user was in the www.domain.com/how-it-works.php page. The active class contians the styles to make the menu item appear that way.
Thanks in advance
Hard to test with not having the DB outputs to match against mate but try this, basically you want an if statement to get the current page URL and match it against the url you get back from the DB.
<?php
if ($result->num_rows > 0) {
$pageURL = str_replace('/', '', $_SERVER['REQUEST_URI']);
$homeURL = $_SERVER['REQUEST_URI'];
// output data of each row
while($row = $result->fetch_assoc()) {
if($row['id'] == 2){ ?>
<li class="nav-item dropdown">
<a href="" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="services">
<?php echo $row["pagename"];?>
<i class="zmdi zmdi-chevron-down"></i>
</a>
<ul class="dropdown-menu">
<?php while($sub_row = $result2->fetch_assoc()) {?>
<li>
<a href="<?php echo $sub_row["link"]; ?>" class="dropdown-item">
<?php echo $sub_row["pagename"] ?>
</a>
</li>
<?php } ?>
</ul>
</li>
<?php
} else if($row['id'] == 1){ ?>
<li class="nav-item dropdown <?php echo ($homeURL == $row["link"])? 'active' : '';?>">
<a href="<?php echo $row["link"]; ?>" class="nav-link dropdown-toggle animated fadeIn animation-delay-7">
<?php echo $row["pagename"]; ?>
</a>
</li>
<?php
} else { ?>
<li class="nav-item dropdown <?php echo ($pageURL == $row["link"])? 'active' : '';?>">
<a href="<?php echo $row["link"]; ?>" class="nav-link dropdown-toggle animated fadeIn animation-delay-7">
<?php echo $row["pagename"]; ?>
</a>
</li>
<?php }
}
} else {
echo "0 results";
}
?>
Edit:
Bit that gets the current page url is:
$pageURL = end(explode('/', $_SERVER['REQUEST_URI']));
Bit that does the check is (this is just a shorthand if statement:
<?php echo ($pageURL == $row["link"])? 'active' : '';?>
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"
)
)
)
);
<div class="menu clearfix">
<ul>
<li>start</li>
<li>rating</li>
<li>upload</li>
</ul>
Was a while since i used php. Is there any smart way to do a foreach in php and render this menu + an "active" class to the clicked link. So if the active page is "rating", the html would render:
<div class="menu clearfix">
<ul>
<li>start</li>
<li>rating</li>
<li>upload</li>
</ul>
Thanks
Assuming the $_GET value of p would be rating (or any other link in the menu for that matter), one could do something like this:
<?php
echo "<div class=\"menu clearfix\">";
echo "<ul>";
$links = array('rating', 'upload', 'about');
foreach ($links as $link) {
$active = "";
if (!empty($_GET['p']) && $link == $_GET['p']){
$active = 'class="active"';
}
echo "<li><a href=\"./?p=$link\" $active>$link</a></li>";
}
echo "</ul></div>"
?>
As far as I understand you want to know which li is active after request.
If it is - you have to get $_GET parameter smth like $_GET['p'].
And do rendering, smth like:
foreach($ul as $li)
{
if ($_GET['p'] == $li->code)
echo 'class="active"';
}
For example:
<div class="menu clearfix">
<ul>
<?php foreach($ul as $li): ?>
<li><a href="<?php echo $li->url;?>" <?php echo $_GET['p']==$li->get ? class="active" : ''?>><?php echo $li->name;?></a></li>
<?php endforeach; ?>
</ul>
<ul class="sub-nav" >
<?php
$full_name = $_SERVER['PHP_SELF'];
$name_array = explode('/',$full_name);
$count = count($name_array);
$page_name = $name_array[$count-1];
?>
<li><a class="<?php echo ($page_name=='where-to-buy.php')?'active':'';?>" href="where-to-buy.php">WHERE TO BUY</a></li>
<li><a class="<?php echo ($page_name=='about.php')?'active':'';?>" href="about.php">ABOUT US</a></li>
<li><a class="<?php echo ($page_name=='contact.php')?'active':'';?>" href="contact.php">CONTACT US</a></li>
Please follow below URL to live demo...
https://webdesignerhut.com/active-class-navigation-menu/