Creating cookie with a form values makes a null cookie

First of all, i need to create a cookie with a values that are in a form, and a lot of values are in a radio input type, but i ran into a problem with creating it.

Here is the code:

<script>
        function setCookie(name, value, daysToLive) {
    var cookie = name + "=" + encodeURIComponent(value);
    
    if(typeof daysToLive === "number") {

        cookie += "; max-age=" + (daysToLive*24*60*60);
        
        document.cookie = cookie;
    }
}
function getCookie(name) {
    // Split cookie string and get all individual name=value pairs in an array
    var cookieArr = document.cookie.split(";");
    
    // Loop through the array elements
    for(var i = 0; i < cookieArr.length; i++) {
        var cookiePair = cookieArr[i].split("=");
        
        /* Removing whitespace at the beginning of the cookie name
        and compare it with the given string */
        if(name == cookiePair[0].trim()) {
            // Decode the cookie value and return
            return decodeURIComponent(cookiePair[1]);
        }
    }
    
    // Return null if not found
    return null;
}
function checkCookie() {
    // Get cookie using our custom function
    var firstName = getCookie("firstName");
    
    if(firstName != "") {
        alert("Welcome again, " + firstName);
    } else {
        firstName = prompt("Please enter your first name:");
        if(firstName != "" && firstName != null) {
            // Set cookie using our custom function
            setCookie("firstName", firstName, 30);
        }
    }
}
        function createCookie() { 
if (!document.f1.txt1.value) {
alert("Имя не введено");
document.f1.txt1.focus();
}
else { 
    name=document.f1.txt1.value;
    value=document.f1.gender.value+","+document.f1.edu.value+","+document.f1.theme.value;
    setCookie(name,value,4);
    checkCookie();
}
}

i got the code for all the functions from tutorialrepublic.com except the last one, which i made on my own. it should create a cookie from the values which i choose in a form when i click the button here:

<form name="f1">
        <p>Имя: <input type="text" name="txt1">

        <p>Пол: <input type="radio" id="male" name="gender" value="male" checked>
        <label for="male">Мужской</label> <br>
        <input style="margin-left: 215e-2%;" type="radio" id="female" name="gender" value="female">
        <label for="female">Женский</label>

        <p>Образование: <input type="radio" id="elem" name="edu" value="elem" checked>
        <label for="elem">Начальное</label> <br>
        <input style="margin-left: 53E-1%;" type="radio" id="sec" name="edu" value="sec">
        <label for="sec">Среднее</label><br>
        <input style="margin-left: 53E-1%;" type="radio" id="high" name="edu" value="high">
        <label for="high">Высшее</label>

        <p>Цветок: <input type="radio" id="flow1" name="theme" value="flow1" checked>
        <img for="flow1" src="flow1.png" width="200px" height="200px"> 
        <input type="radio" id="flow2" name="theme" value="flow2">
        <img for="flow2" src="flow2.png" width="200px" height="200px">  <br>
        <input style="margin-left: 325E-2%" type="radio" id="flow3" name="theme" value="flow3">
        <img for="flow3" src="flow3.png" width="200px" height="200px"> 
        <input type="radio" id="flow4" name="theme" value="flow4">
        <img for="flow4" src="flow4.jpg" width="200px" height="200px"> 

    </form>
    <button onclick="createCookie()">Create cookie</button>
    <button onclick="checkCookie()">Check cookie</button>

Fortunately, it creates a cookie, but with a null value. i consider that the problem is with the form values types,or with the form itself,but can’t see how i can fix this. i’m new in javascript so this problem can be easy to fix for you. can you help me to find my mistakes?

Answer

Code is totally ok, the problem is not with the code, but with my browser. the main thing is thath Google Chrome doesn’t allow to make a cookie from a local file, and needs at least a server. if you open this code in Firefox, it will work, but till you close the browser

Advertisement

Answer