Help getting Tabs to Refresh

[Paul_Wilkins]

@forforfor

i tried to use that but apparently, it did not work. What i want is for third tab when i press refresh button, it will reload the page and stay at third tab. While when i go to the fourth tab, when i click yes, it will direct me to the first tab.

Yes, it is definitely possible. I have put together a small working demo for you.

Note, that codepen disables window.location commands. The technique though works just fine in the real world though.

The scripting code is minimal, but fully works.

$("#tabs").tabs({
    activate: function(event, ui) {
        localStorage.selectedTab = ui.newTab.index() + 1;
    },
    active: (localStorage.selectedTab) ? localStorage.selectedTab - 1 : 0
});
$("#refreshRef").on("click", function () {
   window.location.reload();
});
$("#backToLive").on("click", function () {
  $("#tabs").tabs("option", "active", 0);
});
$("#exitSite").on("click", function () {
  window.location = "http://www.google.com";
});

[forforfor]

Hey. Thanks for replying, anyway, for this javascript, do i just put it before ? like

[Paul_Wilkins]

[quote=“forforfor, post:65, topic:224247, full:true”]
Hey. Thanks for replying, anyway, for this javascript, do i just put it before ?

Yes indeed. Take a look at the sample code to see how the $(“#backToLive”) parts work with the existing HTML content.

You can also see a more complete working example at http://fiddle.jshell.net/pmw57/6btcznrw/4/show/light/ and explore its code at https://jsfiddle.net/pmw57/6btcznrw/4/

[forforfor]

May i know is there a way to remove the grey tab beside my reference ? as i shift the logout tab to the most right.

[Paul_Wilkins]

@forforfor

May i know is there a way to remove the grey tab beside my reference ?

I cannot tell you how to fix that because you haven’t shown us the code for how you’ve moved it.

Things do seem to work well on my test page though when I move the last tab to the right.
The CSS that I’m using to move the last tab to the right is:

.ui-tabs-nav li:last-child { 
    float: right; 
}

You can see the example at https://jsfiddle.net/pmw57/6btcznrw/5/

[forforfor]

I tried to use that css but didnt manage to work. Do i put at my html css or jquery css.