Javascript/Tabs+Panes

Beginners
1

I am a nubee and need help with tabs.

I am able to add a tab group to my page using the Javascript/Tabs+Panes from the PG Library List. But they do not work - when I click on them in my browers, nothing happens.
Other tab groups from previous and different app-generated tabs all work fine so I know its not a browser issue.

So simply inserting or dragging the Tabs+Panes element into my page isn’t enough for functionality - must they be inserted into a special element or are div’s OK? Do I need to add/insert some code or plugin additionally so they will tab correctly?

Anyone get them to work and can share insight as to how?

2

If you’re using the Javascript Tabs, or any Javascript element, you also need to have the javascript library either on your server, and it’s location reference in your HTML, or it’s location online referenced in your HTML… for example, at the end of your page, you should see:

<script src="assets/js/jquery.min.js"></script>
 if it's on your server in the assets/js/ folder

or

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
If you're hosting it remotely.

So if you’re using the first way, then you must make sure you have the corresponding folder structure on your server in your website’s folder, and the jquery library must be in there.

Question, do the tabs work in the Pinegrow browser view when you use the test click feature? (the little green finger in the top menu) Then how about if you preview in a browser locally?

3

Printninja – Thanks for the answer to this post, as I have a similar learning curve.

Question: I thought that if I place the ‘script-tag’ in my html for a js library, that the library is sourced directly from the js URL, and therefore I would not need to upload the js library to my hosting server.

Is that accurate?

4

Yes, you can load the js library from your web server, or from a remote server like Google or others. If you load it remotely, then you don’t need to host it locally.

5

Thanks!

And by your phrasing, “you can load…” i understand you to mean that no actual action is needed to be taken by me, but rather the JS library is acquired by the commercial hosting server as part of their standard hosting services?

6

Daniel,

No, when I say “load”, what I mean is you will first upload the javascript library (jquery.min.js) along with all your other website files to your web server, and then whatever pages in your site use javascript, will need to have a line in the HTML like this (usually located after the footer.)

<script src="js/jquery.min.js"></script>

This is basically telling any javascript scripts on the page that they will look in the folder “js” for the file named jquery.min.js. That is how the website “loads” javascript. Alternately, you can load the library from an online source, like Google’s hosted libraries, in which case the script would look like this…

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

The “src” is short for source.

7

Oh, Got it.Thanks for clarifying!