Skip to main content

Strange cookie bug, javascript

Comments

7 comments

  • tenaui

    In your code, there seems to be a typographical error when accessing the dataArray array. In the showData() function, you have mistakenly used datArray instead of dataArray. This typo is likely causing the issue you described, where the first key-value pair is not displayed correctly and an unexpected semicolon ";" appears.

    Direct to garments printer

    Here's the corrected version of your showData() function:

    function showData() {
      var savedCookie = document.cookie;
      var dataArray = savedCookie.split("&");
      alert(dataArray[0]); // the first key-value pair from str
      alert(dataArray[1]); // the second key-value pair
      // ... continue with the rest of the code
    }

     

    By using the correct variable name dataArray, you should be able to access the key-value pairs from the serialized form data stored in the cookie correctly.

    Additionally, in your serializeFormToCookie() function, you reference an undefined variable expires when setting the cookie's expiration date. You need to define and set a valid expires value, such as a Date object, before using it in the document.cookie assignment. For example:

     

    function serializeFormToCookie() {
      var str = $("form").serialize();
      alert(str);

      var expires = new Date(); // Set a valid expiration date here
      expires.setDate(expires.getDate() + 7); // Example: 7 days from now

      document.cookie = str + "&expires=" + expires.toUTCString();

      alert("You have successfully stored your reservation. Please click 'Show' if you would like to review it.");
    }

     

    Make sure to replace the new Date() and expires.setDate() lines with appropriate values for your desired expiration duration.

    With these corrections, you should be able to access and display the serialized form data correctly using the showData() function.

    0
  • Abdullah Salik

    It seems like you're encountering a cookie storage and retrieval issue. The semicolon ";" in the second `showData` alert indicates a new cookie is being treated separately. To address this, try assigning a specific cookie name during storage and retrieval. Additionally, use `encodeURIComponent` to properly handle special characters in the serialized data for consistent behavior. This should help resolve the problem you're facing. 

    0
  • Stubblefield

    function showData() {
        var savedCookie = document.cookie;
        var keyValuePairs = savedCookie.split("; "); // Split by "; " (semicolon followed by space)

        for (var i = 0; i < keyValuePairs.length; i++) {
            var keyValue = keyValuePairs[i].split("=");
            var key = keyValue[0];
            var value = keyValue[1];

            alert(key + ": " + value);
        }
    }

    0
  • usesfar

    Hey there! It looks like you've got a cookie conundrum in your JavaScript code. When serializing the form and storing it in a cookie, you're getting a sneaky semicolon and some unexpected blanks in the dataArray when you try to retrieve and split the cookie later.

    The semicolon might be coming from the way cookies are separated. Try adding a space after the ampersand like str + "& expires=" + expires.toUTCString().

    Also, make sure there are no leading or trailing spaces in your cookie data.

    And double-check your variable spelling, like "datArray" should be "dataArray".

    Happy coding and hope this solves your cookie caper! 🍪

    0
  • destinator

    The issue you're experiencing with your code may be related to how cookies are being processed and split. Here's a possible explanation and a corrected version of your code:

    1. Extra Semicolon Issue:

      • In JavaScript, when you set a cookie using document.cookie, it automatically appends a semicolon and space after each key-value pair. This is why you're seeing the semicolon in your dataArray[1].
    2. Blank Key-Value Issue:

      • The reason dataArray[0] is blank might be due to the initial cookie string containing a leading semicolon, which results from the issue mentioned above.

    To address these issues, you can modify your code as follows:

    function serializeFormToCookie() {
      var str = $("form").serialize();
      alert(str);

      // Set the cookie without extra processing
      document.cookie = str + "; expires=" + expires.toUTCString();

      alert("You have successfully stored your reservation, please click show if you would like to review it.");
    }

    function showData() {
      var savedCookie = document.cookie;
      var dataArray = savedCookie.split("; "); // Split using the correct delimiter

      // Loop through dataArray to display key-value pairs
      for (var i = 0; i < dataArray.length; i++) {
        alert(dataArray[i]);
      }
    }


    0
  • mark

    Certainly, you've encountered a JavaScript cookie bug and need assistance. To provide specific help, please provide detailed information about the bug, including its behavior, relevant code, the browser and version you're using, and any error messages from the browser's console. With these details, I can offer guidance on how to resolve the issue.

    0
  • rabiasher

    It looks like you have a couple of issues in your code:

    1. Typo: There is a typo in your code. In the showData function, you have a typo in the alert(dataArray[1]) line. You wrote datArray instead of dataArray.

    2. Cookie Format: When you set a cookie, it's important to specify a name for the cookie. You're not setting a name for your cookie; you're just putting the serialized form data directly into the cookie. That's why you're seeing unexpected results when splitting the cookie string.

    Here's an updated version of your code:

    javascriptCopy code
    function serializeFormToCookie() { var str = $("form").serialize(); alert(str); document.cookie = "formData=" + str + "; expires=" + expires.toUTCString(); alert("You have successfully stored your reservation, please click show if you would like to review it."); } function showData() { var savedCookie = document.cookie; var dataArray = savedCookie.split(";"); // Split by semicolon to get separate cookies for (var i = 0; i < dataArray.length; i++) { var cookie = dataArray[i].trim(); // Trim any leading/trailing spaces if (cookie.indexOf("formData=") === 0) { // Check if it's the formData cookie var formData = cookie.substring("formData=".length); // Extract the form data alert(formData); break; // Exit the loop once the formData cookie is found } } }

    This code sets a cookie named "formData" with the serialized form data. When you want to retrieve it, it searches for the "formData" cookie and extracts the data from it.

    0

Please sign in to leave a comment.