Seeking help with an issue I'm facing. I am attempting to create functionality where clicking on "Newsletters," "News," or "Public Announcements" alters the layout to display the correct view and saves it in localstorage.
Currently, when clicking on any of the mentioned items, the layout does not change, and data is not stored in localstorage...
Your assistance is highly appreciated.
Javascript:
$(document).ready(function(){
// Changing layout to 'newsletters'
$('.news_nav-for_nckcn ul li:nth-of-type(1)').on('click', function () {
changeToNewslettersView();
});
// Changing layout to 'news'
$('.news_nav-for_nckcn ul li:nth-of-type(2)').on('click', function () {
changeToNewsView();
});
$('.news_nav-for_nckcn ul li:nth-of-type(3)').on('click', function () {
changeToPublicAnnouncementsView();
});
if (typeof(Storage) !== "undefined") {
var view = localStorage.getItem("view");
if (view && view == "newsletters") {
changeToNewslettersView();
} else if (view && view == "news") {
changeToNewsView();
} else if (view && view == "publicAnnouncements") {
changeToPublicAnnouncementsView();
} else {
// view isn't set, or is set to something we don't recognize
}
} else {
// user's browser doesn't support localStorage
}
});
// Changing layout 'news' & 'publicAnnouncements' to 'newsletters'
function changeToNewslettersView() {
var news=document.getElementById('hideClass');
news.style.display="none";
var publicAnnouncements=document.getElementById('hideClass');
publicAnnouncements.style.display="none";
var newsletters=document.getElementById('showClass');
newsletters.style.display="block";
storagePut("newsletters");
$('.news_nav-for_nckcn ul li:nth-of-type(1)').addClass('active');
$('.news_nav-for_nckcn ul li:nth-of-type(2)').removeClass('active');
$('.news_nav-for_nckcn ul li:nth-of-type(3)').removeClass('active');
}
// Changing layout 'newsletters' & 'publicAnnouncements' to 'news'
function changeToNewsView() {
var newsletters=document.getElementById('hideClass');
newsletters.style.display="none";
var publicAnnouncements=document.getElementById('hideClass');
publicAnnouncements.style.display="none";
var news=document.getElementById('showClass');
news.style.display="block";
storagePut("news");
$('.news_nav-for_nckcn ul li:nth-of-type(2)').addClass('active');
$('.news_nav-for_nckcn ul li:nth-of-type(1)').removeClass('active');
$('.news_nav-for_nckcn ul li:nth-of-type(3)').removeClass('active');
}
// Changing layout 'newsletters' & 'news' to 'publicAnnouncements'
function changeToPublicAnnouncementsView() {
var newsletters=document.getElementById('hideClass');
newsletters.style.display="none";
var news=document.getElementById('hideClass');
news.style.display="none";
var publicAnnouncements=document.getElementById('showClass');
publicAnnouncements.style.display="block";
storagePut("publicAnnouncements");
$('.news_nav-for_nckcn ul li:nth-of-type(3)').addClass('active');
$('.news_nav-for_nckcn ul li:nth-of-type(1)').removeClass('active');
$('.news_nav-for_nckcn ul li:nth-of-type(2)').removeClass('active');
}
function storagePut(view) {
if (typeof(Storage) !== "undefined") {
localStorage.setItem("view", view);
} else {
// user's browser doesn't support localStorage
}
}