CODEWITHSUNDEEP
jqueryvariablesstoragelocal
Six God
Six God

Reputation: 47

jQuery Store data variable from previous click

I have a click function which occurs when the user presses a 'player' in my game. I'm trying to code a substitution between two players. The function first checks to see whether another player has already been selected, if so, it checks to see whether they are on the bench or not. If they're on the bench then it stores the second players data information.

The problem is with storing the first players data information. When I alert 'pid' it comes up as undefined. Is there anyway of storing pid so that the next time a user clicks on another player, the information stored under 'pid' remains? I realise that 'pid' is being declared within the function, I have tried declaring it first outside the function but this is still not working.

var pid;

  $('.player').click(function() {

    event.preventDefault();

    var start = $(this).data("start");

    if ($(".show2")[0]){
      // Player has already been selected

      if ($(this).children('.show2').length) {
        // User has selected same player, toggle off select image and return

        $(this).children('.player-select').toggleClass('show2');
        return;
      }

      if(start == 'FirstEleven'){
        $(".message-alert").css("display", "block");
        $(".message").html('You must substitute a player from the bench');
        $(".overlay2").css("opacity", "0.5");
        $(".overlay2").css("display", "block");
        $(".container2").css("pointer-events", "all");
      }

      if(start == "Bench"){
        var pid2 = $(this).data("id");
        var element2 = $(this).data("element");

        alert(pid);
        alert(pid2);
      }

    } else {
      // First player to be selected

      if(start == 'Bench'){
        // If player selected is on the bench
        $(".message-alert").css("display", "block");
        $(".message").html('You must select a player from the starting lineup first');
        $(".overlay2").css("opacity", "0.5");
        $(".overlay2").css("display", "block");
        $(".container2").css("pointer-events", "all");
        return;
      }

      $(this).children('.player-select').toggleClass('show2');

      var pid = $(this).data("id");
      var element = $(this).data("element");

    }

  });

Upvotes: 0

Views: 45

Answers (1)

xdeepakv
xdeepakv

Reputation: 8125

You can use sessionStorage for this kind of use case. It will be clean once windows close. Or you can clean programmatically.

sessionStorage.setItem("players1", "deepak")

console.log(sessionStorage.getItem("players1"))

Upvotes: 1

Related Questions