You are here:  » php on click

Active Forum Topics

php on click

Submitted by thelegacy on Sat, 2019-11-23 23:22 in

Greetings David,
13+ years and still at it with PT, I'm working on a new layout and I've a modified featured_products page (several actually) that I'm wanting to call in with a php 'on click' function in the below example menu.
It's a product slider that I'm trying to get to call specific categories into the page when the nav link is clicked. The links line up horizontal in a tab formation and I have built a featured page for each of these categories as well. Was hoping you could help me out or provide an alternative suggestion.

<div class='text-center'>
  <ul class='product-filter-menu nav-tabs'>
    <li class='nav-item'><a class='nav-link' href='#'>TOPS</a></li>
    <li class='nav-item'><a class='nav-link' href='#'>JUMPSUITS</a></li>
    <li class='nav-item'><a class='nav-link' href='#'>LINGERIE</a></li>
    <li class='nav-item'><a class='nav-link active' href='#'>JEANS</a></li>
    <li class='nav-item'><a class='nav-link' href='#'>DRESSES</a></li>
    <li class='nav-item'><a class='nav-link' href='#'>COATS</a></li>
    <li class='nav-item'><a class='nav-link' href='#'>JUMPERS</a></li>
    <li class='nav-item'><a class='nav-link' href='#'>LEGGINGS</a></li>

Thanks in advance,

Submitted by support on Mon, 2019-11-25 11:19

Hi Ray,

If your template is using jQuery you could do something with .load() which loads arbitrary HTML from a URL into the specified element, for example if you have on your page below the slider;

<div id='featured_content'></div>

...but the content you load needs to be the raw HTML without the header etc. so one thing to do would be to add support for a ?ajax=1 parameter for your featured pages to exclude the header and footer if $_GET["ajax"] is set e.g.

if (!isset($_GET["ajax"]))


if (!isset($_GET["ajax"]))

Then in your slider HTML, something like;

     <li class='nav-item'><a class='nav-link' href='#' onclick='$("#featured_content").load("/featured_tops.php?ajax=1")'>TOPS</a></li>

Hope this points you in the right direction...


Submitted by thelegacy on Mon, 2019-11-25 20:57

Hi David,
Thanks for the suggestion, part of it I'm able to work out, but only getting my first tab list to show in panes. I'm posting the code work below for what I am currently working with.. perhaps you'll see right off where I need to change something. Unless I need to add multiple categories to pull from database? I figure I'm close at any rate, lol
{code saved}

Thanks again, and as expected still awesome support, none better out there!


Submitted by support on Thu, 2019-11-28 13:57

Hello Ray,

Thank you for your comments!

For this pattern the <div class='container-fluid'>...</div> containing the tabs should be part of a separate file as what I think will be happening with the above is that every .load() call is creating a new instance of the tabs HTML inside the existing tabs (which would almost certainly break things...)

If you save the code posted without the container-fluid as a separate file - perhaps one just for the purposes of serving the ajax response (and then you don't need the isset() checks) that should be all it is...


Submitted by thelegacy on Fri, 2019-11-29 20:06

Thanks for your expertise David, hope you had a nice Thanksgiving as well.
Wanted to show you what I've ended up with on this, went a little different approach from what we've discussed here.
Have a look {code saved}

Submitted by support on Fri, 2019-11-29 20:44

You're welcome! Seasons greetings to you also.