Jump to content
Latest News: (loading..)
Demitry

HeaderScroll addon - need help with default setting

Recommended Posts

hi,

I need some help to solve an interesting code logic puzzle with an addon for header scrolling on the product_info.php page. This one:

https://apps.oscommerce.com/eZbEr&headerscroll-for-oscv2-3-4-bs-edge

This is a module for the product_info.php page where a customer can check the HeaderScroll checkbox and each time they load a product page, that page will load scrolled past the header. This spotlights the product offering with each product view and the customer has full control to enable or disable this feature for their session.

~~~~

What I have not been able to solve is how to set the HeaderScroll checkbox to be enabled (checked) by default when the customer’s session starts. The user’s checkbox input is stored in sessionStorage.

I tried the most obvious… setting the checkbox $checked value to true,.. and I tried the same using jQuery on document ready, but with both of these tactics the checkbox only flashes checked for a split second and then applies the unchecked status from sessionStorage.

The challenge is to possibly set sessionStorage to have the checkbox enabled, but only on the very first instance (product page visit). Otherwise it will always revert to being checked on each new product page load regardless of the customer’s preferred selection.

Here is the jQuery for the sessionStorage part of this feature:

 

// HeadScroll save checkbox state to session
$(function(){
    $('#scroll').each(function() {
        var $el = $(this);
        $el.prop('checked', sessionStorage[$el.prop('id')] === 'true');
    });

    $('#scroll').on('change', function() {
        var $el = $(this);
        sessionStorage[$el.prop('id')] = $el.is(':checked');
    });
});

Any help would be greatly appreciated.

 

PS: Please note that this is not a support thread for this addon. I’m just trying to get some assistance to improve it for the osC community.

Share this post


Link to post
Share on other sites

According to Mozilla at https://developer.mozilla.org/en-US/docs/Web/API/Storage/getItem

You can say instead: 

// HeadScroll save checkbox state to session
$(function(){
    $('#scroll').each(function() {
        var $el = $(this);
        var $checked = sessionStorage.getItem($el.prop('id'));
        if ($checked === null) {
            sessionStorage.setItem($el.prop('id'), 'true');
        }
        $el.prop('checked', sessionStorage[$el.prop('id')] === 'true');
    });

    $('#scroll').on('change', function() {
        var $el = $(this);
        sessionStorage[$el.prop('id')] = $el.is(':checked');
    });
});

I haven't tried this.  This is just from looking at docs. 


Always backup before making changes.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×