CODEWITHSUNDEEP
javascript
daebird
daebird

Reputation: 13

trouble clearing session variables on click

I am a newbie coding a fun quiz app for a friend in Flask. I am keeping track of the number of guesses on the day's question by using session variables in JavaScript to listen for when the question's form submits, count the submissions, and display them for the user as number of guesses. My guess counter is working fine on the backend and also displays fine, but for some reason my link for users that calls the session.clear() function is not working. I want to be able to use this so users can reset their number of guesses without leaving the page.

I have a lot of code to gather the number of form submissions into session variables, display it, and then clear it. I've modified this from a related example I found on sitepoint. I think my issue is coming from having to tinker and not being very good at JavaScript. I have a json-serialization.js; that one seems to be working fine, so I'm not including it here. I also have a sessions.js that implements the JavaScript session variables. Relevant code below:

// submit form event
if (window.addEventListener) window.addEventListener('submit', Save, false);
else window.onsubmit = Save;

// public methods
return {

   // set a session variable
   set: function(name, value) {
      store[name] = value;
   },

   // get a session value
   get: function(name) {
      return (store[name] ? store[name] : undefined);
   },

   // clear session
   clear: function() { store = {}; },

I'm wondering if there's something wrong with how I'm coding my eventListener? Anyway, then on my play.html page I have:


<script type="text/javascript">
// <![CDATA[

// initialize application defaults
var counter = session.get("counter") || {
    submit: -1,

// onload
window.onload = function() {

   // update previous guesses
   var d = new Date();
   counter.submit++;

   // update page
   document.getElementById("guesses").firstChild.nodeValue = counter.submit + " guess" + 
      (counter.submit == 1 ? "" : "es");
  
   // store value in session
   session.set("counter", counter);

};

// add leading zeros
function Pad(n) {
   n = "00" + n;
   return n.substr(n.length-2);
}
// ]]>
</script>

And finally I have where I am actually displaying the number of guesses (which works just fine, no problems), and the session.clear function that just won't seem to work. If I leave the app and then return, of course the session clears just fine, but I want to clear it on the click from the site.

<p>You have made <strong><span id="guesses">0 </span></strong> today.</p>

<p>Remember to click <a href="/play" onclick="session.clear();">
<strong>reset guesses</strong></a> when it's time to play a new game.</p>

Sorry for the length, but I wanted to be clear. Thanks for any help you can give.

Upvotes: 0

Views: 81

Answers (2)

daebird
daebird

Reputation: 13

I eventually found someone IRL who helped me here. Keep the session.js the same; no prob there. To fix, define the function

function clearCount() {
    document.getElementById("guesses").innerText = '0 guesses';
    session.clear();

Then, on the counter:

<p>Remember to click <button onclick='clearCount();'>here</button> to reset guesses
    when to play a new game.</p>

Upvotes: 0

bop34
bop34

Reputation: 61

Looks to me that you just capitalised the letter s in session.clear() for the onclick attribute. I think it should be as follows.

<p>Remember to click <a href="/play" onclick="session.clear()"><strong>reset guesses</strong></a>
    when it's time to play a new game.</p>

Upvotes: 1

Related Questions