I_Literally_Cannot
I_Literally_Cannot

Reputation: 170

Disable a button on another HTML file from a separate JavaScript file

This may be a really easy one to answer, but I may be missing something. I've only been into this for a few months.

I am wondering if it is possible to disable a button on a different HTML document based on a click function.

The idea is simple:

HTML1:

<input type="submit" class="guest" value="I'm just visiting">

HTML2:

<input type="submit" class="thisbutton" value="Feature not for guests">

JS:

$('.guest').click(function() {
        $('.thisbutton').prop('disabled', true); //this is on another file
        $('.thisbutton').css('background-color', 'grey');
    });

Some ideas:

With a cookie? With a link in the header? The cookie is one idea but it would be easy to delete.

Thanks for your time to look at this!

Upvotes: 1

Views: 715

Answers (1)

Zakaria Acharki
Zakaria Acharki

Reputation: 67525

You could use local storage for that by saving an entry for the guest when the user clicks on .guest button in the HTML1 page then gets the entry in the other page HTML2 in the ready function to disable the thisbutton.

HTML 1:

// set the item in localStorage on click
$('.guest').click(function() {
    localStorage.setItem('guest', true);
});

HTML 2 :

$(function(){
    // get the item 
    if ( localStorage.getItem('guest') !== null ) {
        $('.thisbutton').prop('disabled', true);
        $('.thisbutton').css('background-color', 'grey');
    }
});

Upvotes: 2

Related Questions