Search code examples
javascriptpersistenceframeset

Making a frameset remember it's cols (width) the next time the page is loaded


I am trying to force persistence on to a frameset - I want to make it work so that the user is able to set his desired width (cols) for the frame and make sure the value is saved and loaded the other time the user accesses the page.

I am using this simple example page:

<html>
<head>
<script type="text/javascript">
function loadFrameWidth()
{
    document.getElementById('masterFrameset').cols = '150,*';
}

function storeFrameWidth()
{
 alert(document.getElementById('masterFrameset').cols);
}
</script>
</head>
<frameset id="masterFrameset" border="3" frameborder="1"
onLoad="loadFrameWidth()" onUnload="storeFrameWidth()">
  <frame id="controls" name="controlsFrame" src="about:blank" />
  <frame id="content" name="contentFrame" src="about:blank" />
 </frameset>
</html>

The problem that happens is that when I exit the page (the moment when it is "supposed" to store the width in a cookie) the "cols" value is not updated even if I have manually changed the width of the columns (via mouse).


Solution

  • *** A WORKING SOLUTION ***

    <html>
    <head>
    <script type="text/javascript">
    <!--
    function loadFrameWidth(cookieName)
    {
        if (document.cookie.length>0)
     {
         c_start = document.cookie.indexOf(cookieName + "=");
      if (c_start != -1)
      {
       c_start = c_start + cookieName.length + 1;
       c_end = document.cookie.indexOf(";",c_start);
       if (c_end == -1) { c_end=document.cookie.length; }
       document.getElementById('masterFrameset').cols = unescape(document.cookie.substring(c_start,c_end));
      }
      else { setStandardWidth(); }
     }
     else { setStandardWidth(); }
    }
    
    function setStandardWidth()
    {
     document.getElementById('masterFrameset').cols = '150,*';
    }
    
    function storeFrameWidth(cookieName)
    {
     var currentCols = document.getElementById('masterFrameset').cols;
     var exdate = new Date();
     exdate.setDate(exdate.getDate() + 7);
     document.cookie = cookieName + "=" + escape(currentCols) + 
     ";expires=" + exdate.toUTCString();
    }
    -->
    </script>
    </head>
    <frameset id="masterFrameset" border="1" frameborder="1"
    onLoad="loadFrameWidth('frameSetWidth')" onUnload="storeFrameWidth('frameSetWidth')">
      <frame id="controls" name="controlsFrame" src="toc.html" />
      <frame id="content" name="contentFrame" src="content.html" />
     </frameset>
    </html>