Mysterious Tab problem. - Run into it probably 3 times.

Top Section

{ Tab Items Tab "Photos" <li class="active"> <i class="glyphicon glyphicon-camera" datatoggle="tooltip" title="Photos"></i> Photos }

Bottom section

{ Tab Content Tab Pane "#tab-15"

<div class="tab-pane" role="tabpanel" id="tab-15"> <div class="photo-gallery"> <div class="intro"> <h3 class="text-center">Captain Wheeler House Gallery</h3>

Seasonal Exterior and Interior Photographs.

        &lt;/div&gt;
        &lt;div class="row photos"&gt;
            &lt;div class="col-lg-3 col-md-4 col-sm-6 item"&gt;
                <a href="Morning-after-a-New-Year-Snow.jpg"><img src="Morning-after-a-New-Year-Snow.jpg" /></a>
            &lt;/div&gt;
        ...Taking out photos here
            &lt;div class="col-lg-3 col-md-4 col-sm-6 item"&gt;
                <a href="1853-Captain-Wheeler-House.jpg"><img src="1853-Captain-Wheeler-House.jpg" /></a>
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;

}

Photos was working and now it isn't http://crimson-paper-3666.bss.design/ The Tab# were out of order, so I changed them successfully, saved & tested and they worked. Then closed the program and went to bed. This afternoon I opened the Trial website up and when I picked show to show a particular Tab all the linkages seemed screwed up the wrong ones were coming up. I closed the program and opened it again. This time it was just the Photos that would not work properly. As I said, I had changed

<Tab> "Photos <Link> to be <a href="#tab-6" <Tab Pane> to be <div id="tab-6"

both via the Attributes. Then when I ran into trouble, after trying the link and it was not working, I tried using tab-12 for both then tab-15, and neither seem to work. I have tried entering via the Attributes various things in hopes it is something about the way you enter attributes.

} href= "#tab-15" <<-- puts double quotes, not good. href "#tab-15" <<--puts double quotes, not good. href= #tab-15 <<-- correct, end up with quotes. Same visual result href #tab-15 <<-- correct, end up with quotes. Same visual result as above. }

The bottom two look the same with href="#tab-15" in the html which is correct.

When we click "Show" it switches to photos, or rewrites, but there are no photos.

Note these two parts of the Tab were originally #7 and I wanted to get them into order now I tried tab-0 thinking something isn't being properly rewritten and by having tab-0 the change might occur before the error occurred, sort of backwards, but it didn't work anyway. The Tab seems to be found when I hit "Show" but the photos don't get shown, it is blank.

I am going to try moving the photos out and then back in to see if that will help.

No it does not help. The tab definitely goes there, but the photos aren't showing up, but I think there is an occasional operational bug in TABS associated with changing numbers. Last time I went through this I had to "Undo" all the tabs that I had changed and then things worked!!! So I am quite sure that is what I have to do now. Just leaving them out of order. PITa

Somewhere along the line you have set a tab as active, but you have change the tabs corresponding content section as some other tabs content so the programming got off kilter on what was set as "active."

Right now your tab-0 is set with the class="active"

<li class="active">
  <*a href="#tab-0" role=tab" data-toggle="tab">.... </a>
</li>

but your content section for tab-0 does not have the class="active" on it.

<div class="tab-content">
  <div class="tab-pane" role="tabpanel" id="tab-0">...</div> <-- missing "active" in the class
</div>

It should correct it's self if you set one of the other tabs in the Toolbar above the Layout View pane in the BSS app. Select the House tab and then set it as active, then you should be able to set the Photos one as it currently is to active and that should correct it. If you manually set the active class the app doesn't programmatically know about it because it didn't set it and it won't replace it, it will just add another active class so you run into 2 tabs contents being set as active.

Saj

Also don't type in quote marks when your typing in the #tab-15 or #tab-0 etc.. in the URL field in the Options pane for a tab, it doesn't work that way. And don't do it in class/id Attributes panes either :)

Saj

Ok no quotes. I highlighed House and made that active, hit SHOW and then select Photos under Tab Items and hit SHOW and no photos. I then reverted back to the original tab-10 on both Tab Items and Tab Content and now it seems to be working again. Don't know why, but something is not set properly although the HTML code all looks consistent and good, but when I try to change tab-10 >> tab-6 so everything is properly numbered, it does not act properly. Must be some kind of bug.... can I send the Trial website somewhere for a test by pros?

select the House tab and then set it as active, then you should be able to set the Photos one as it currently is to active and that should correct it

Thanks Saj, for trying.

Oh, oh, now that same thing is happening to Contacts. It does not work and show the Contact information. I have been super careful about numbering and getting the Tab-# right on the right elements. I am probably going to have to revert this one back to its original Tab number before it will work properly.

This is pretty bad, I've been through this twice now. This is the third time. It was all working properly before, then I change the Tag # to get them in order. Now I click on Owner and hit show and nothing happens. Then click on the Tab Contact and hit show and the Owner information appears! I know the Contact info is down in "Tab Content" as tab-8 and Owner info in Tab Content as tab-7, and the Tab Items have Owner as #tab-7 and Contact as #tab-8 all in parallel.

It is just not working right, and the reason is that Contact originally was #7 so the program is referring to something old that is stored and just plain old getting confused. I order to make all the Tabs work properly again, I have to take out all my overrides (and never do this again!) It does not work.

Ok changed Owner back to #6 and it works and Photos #10 work now. Contacts shows nothing, overrode its number with tab-8. Will now revert it. In <Tab> <Link> for Contacts remove the override attribute href= #tab-8. and it shows up as href=#tab-7 Now go down to Tab Content <Tab Pane #tab-8> and simple change attributes ID to tab-7.

Now its all working again. I undid all my numbering overrides for Photo, Owner and Contact.

I am going to try duplication to solve this.

Ok the current tabs have no # overrides. I have created new Tabs #8 and #9. I probably won't need #9. I am just going to move the contents and setup for each Tab down one, so

  1. Tab-7 Contacts will be moved down to Tab-8
  2. Tab-6 Owner will be moved down to Tab-7
  3. Tab-10 Photos will be moved down to Tab-6
  4. Then I will delete Tab-10 and everything will be in order.

See https://bootstrapstudio.io/forums/topic/tabs-show-options-is-a-bit-buggy/#post-2353 I agree.

Reply #4344 worked

After moving everything carefully, I tested it and then deleted Tab#10 at the top and bottom.

In summary, NEVER NEVER NEVER change tag numbers, even if you are careful. They still reference the OLD tag numbers in some weird way, and this may only appear after you have saved the file and closed the program, then opened it a day later.

The workaround if you want your tag numbers to be in numberical order is not to change them, but to figure out some way to move the content one step at a time. So when making a website from scratch, always create the TAGS in the order that you want them! Plan ahead and then create the Tags in the proper sequential order and don't move them or change the order, move the content.

How about a MOVE TAG command some time? Move the contents of this TAG to this TAG [must be empty]? Note: This is not fully thought through, so there are likely to be other issues.

I suppose these issues could occur with other Navigation styles & techniques too, depending on how BSS works, but I have not tried those alternatives. The solution is a kind of universal situation, that could be applied to TAGS and all the other Navbars.