title: Javascript cookies to remember input value
body: <p>I need to make a website with cookies for my study, but i just can't make it work.
  I have tried to look for solutions everywere but couldn't find what I need, as my teacher wants easy code what he taught me. I need to make a cookie which remembers your username so when you log in next time (don't need to recognise password) you get the message "Welcome again 'user'". It must be done with easy Javascript only!</p>
  
  <p>this is my javascript file(cookies.js):</p>
  
  <pre><code>function setCookie(cname,cvalue,exdays)
  {
  var d = new Date();
  d.setTime(d.getTime()+(exdays*24*60*60*1000));
  var expires = "expires="+d.toGMTString();
  document.cookie = cname+"="+cvalue+"; "+expires;
  }
  
  function getCookie(cname)
  {
  var name = cname + "=";
  var ca = document.cookie.split(';');
  for(var i=0; i&lt;ca.length; i++) 
    {
    var c = ca[i].trim();
    if (c.indexOf(name)==0) return c.substring(name.length,c.length);
    }
  return "";
  }
  
  function checkCookie()
  {
  var user = getCookie("username");
  if (user!="")
    {
    alert("Welcome again " + user);
    }
  else 
    {
    user = document.getElementById("username").value;
    if (user!="" &amp;&amp; user!=null)
      {
      setCookie("username",user,30);
      }
    }
  }
  </code></pre>
  
  <p>And this is my login page(inloggen.html):</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Inloggen&lt;/title&gt;
          &lt;meta charset="iso-8859-1"&gt;
          &lt;meta name="keywords" content="Javascript"&gt;
          &lt;meta name="author" content="Arjan Oskam"&gt;
          &lt;meta name="description" content="Javascript"&gt;
          &lt;link rel="Stylesheet" href="css/style.css"&gt;
          &lt;script type="text/javascript"&gt;
              alert("Deze webpagina maakt gebruik van cookies");
          &lt;/script&gt;
          &lt;script type="text/javascript" src="javascript/cookies.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;script&gt;
              function checkCookie()
              {
                  var user = getCookie("username");
                  if (user != "")
                  {
                      alert("Welcome again " + user);
                  }
                  else
                  {
                      user = document.getElementById("username").value;
                      if (user != "" &amp;&amp; user != null)
                      {
                          setCookie("username", user, 30);
                      }
                  }
              }
          &lt;/script&gt;
          &lt;div id="wrapper"&gt;
              &lt;div id="head"&gt;
                  &lt;div&gt;&lt;img src="images/logo.gif" id="logo" alt="logo"&gt;&lt;/div&gt;&lt;!-- #Logo --&gt;
                  &lt;div id="banner"&gt;&lt;img src="images/banner.jpg" alt="banner"&gt;&lt;/div&gt;
  
  
              &lt;/div&gt;&lt;!-- #Head --&gt;
              &lt;div id="menu"&gt;
                  &lt;nav&gt;
                      &lt;ul&gt;
                          &lt;li&gt;&lt;a href="index.html"&gt;Home&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="id-ontwikkelaar.html"&gt;ID-Ontwikkelaar&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="quiz.html"&gt;Quiz&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="formulier.html"&gt;Registreren&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="inloggen.html"&gt;Inloggen&lt;/a&gt;&lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/nav&gt;
              &lt;/div&gt;&lt;!-- Menu --&gt;
              &lt;div id="inhoud"&gt;
                  &lt;br&gt;
                  &lt;br&gt;
                  &lt;h2&gt;Inloggen&lt;/h2&gt;
                  &lt;div id="tekst"&gt;
                      &lt;form class="uitlijnen" id="form" onsubmit="setCookie();
                  getCookie();
                  checkCookie();"&gt;
                          &lt;br&gt;
                          Gebruikersnaam: &lt;input type="text" name="username" id="username" placeholder="Typ hier uw username" required&gt;&lt;br&gt;&lt;br&gt;
                          Wachtwoord: &lt;input type="password" name="wachtwoord" placeholder="Typ hier uw wachtwoord" required&gt;&lt;br&gt;&lt;br&gt;
                          &lt;input type="submit" value="inloggen" class="button"&gt;
                      &lt;/form&gt;
                  &lt;/div&gt;&lt;!-- #Tekst --&gt;
              &lt;/div&gt;&lt;!-- #Inhoud --&gt;
          &lt;/div&gt;&lt;!-- #Wrapper --&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I Hope you can help me!</p>