Cookies and Jquery: Dialog Boxes

Question

I am having difficulties creating a cookie (using the jquery cookie plugin) that will remember the position of all dialog boxes on the page (class .dialog). The dialog boxes are draggable.

This is what I have tried:

    <script>
  jQuery(document).ready(function() {

  // cookie period
  var days = 1;

  // load positions form cookies

  $(".dialog").each( function( index ){

  $(this).css( "left",

  $.cookie( "im_" + this.id + "_left") );

  $(this).css( "top",

  $.cookie( "im_" + this.id + "_top") );

  });

  // bind event
  $('.dialog').bind('dragstop', savePos);

  // save positions into cookies
  function savePos( event, ui ){

  $.cookie("im_" + this.id + "_left",

  $(this).css("left"), { path: '/', expires: days });

  $.cookie("im_" + this.id + "_top",

  $(this).css("top"), { path: '/', expires: days });
  }
  });

   alert( $.cookie('') );
      </script>


          <script type="text/javascript">
        $.ui.dialog.defaults.stackfix = true;
        $(function() {
                $('#dialog').dialog({
                        autoOpen: true,   
                });

                $('#dialog_open').click(function() {
                        $('#dialog').dialog('open');
                        return false;
                }); 
        });
        </script>

div id="dialog" title="Basic dialog"> Text goes here. /div

Some of your guru advice would be much appreciated

Answer 1

Hi Harry,

Try using .position().left and .position().right instead of .css("left") and .css("right"), for reading.

That may be the problem. If that doesn't solve it, check whether the cookies are actually setting in the browser and that you are able to read them.