Dear friends,

I noticed in the delayed/distance start draggable feature, on dragging the IE text selection was enabled in the background ( selecting all the page while dragging the element around). To resolve this problem I've just added a little function (at the end of this note) right before/after enabled the feature on some target elements. This problem also happens in the Delayed Start Demo site from Jquery.

You could tune this solution to only disable the selection, during the dragging event, not "forever" as I did.

$('.target-elements').each(function(){
    this.onselectstart = function() { return false; }
})

Att, Roger

I use the datepicker in multiple sections of one form. Within the head area of the site i initialize the datepicker for the class datepicker. Afterwards before the specified inputfields willbe generated in the code i implement a small js section which sets the yearRange option for the specified id.What now happen, is that the first datepicker get the correct parms and show the decided yearRange but the second one show up with standard range ('option', 'yearRange', 'c-10:c+10').

I wasn't able to find an error in my code thats why i guess it depends on the datepicker plugin itself.

Below the code snippets i use.

Here jquery will be initiated and the default values for all datepicker will be set:

//----------------------------------------------------------------------- jQuery
$RET .=
      '<link type="text/css" href="' .
      '../js/jquery/css/smoothness2/jquery-ui-1.8.2.custom.css" '.
      'rel="stylesheet" />' .
      '<script type="text/javascript" src="' .
      '../js/jquery/js/jquery-1.4.2.min.js"></script>' .
      '<script type="text/javascript" ' .
      'src="../js/jquery/js/jquery-ui-1.8.2.custom.min.js"></script>';
//------------------------------------------------------- jQuery Datepicker init
$RET .=
   "<script type='text/javascript'>" .
      "$(document).ready(function() {" .
         "$('.datepicker').datepicker({" .
            "changeMonth: true," .
            "changeYear: true" .
         "});";
if ($RP['l'] == "de"): //---------------------------------------- Language Check
	  $RET .=
	     "$('.datepicker').datepicker('option', 'dayNames', " .
	     "['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag'," .
	     "'Samstag']);" .
	     "$('.datepicker').datepicker('option', 'dayNamesMin', " .
	     "['So','Mo','Di','Mi','Do','Fr','Sa']);" .
	     "$('.datepicker').datepicker('option', 'monthNames', " .
	     "['J&auml;nner','Februar','M&auml;rz','April','Mai','Juni','Juli'," .
	     "'August','September','Oktober','November','Dezember']);" .
	     "$('.datepicker').datepicker('option', 'monthNamesShort', " .
	     "['J&auml;n','Feb','M&auml;r','Apr','Mai','Jun','Jul','Aug','Sep'," .
	     "'Okt','Nov','Dez']);" .
       "$('.datepicker').datepicker('option', 'firstDay', 1 );";
endif;
$RET .=
         "$('.datepicker').datepicker('option', 'dateFormat', 'yy-mm-dd');" .
      "});" .
   "</script>";

Here's the part which is setting parms for the following datpicker:

//==============================================================================
function sc_DatePicker //----------------------------------------- sc_DatePicker
         ($pNAME, $pDATE, $pWIDTH, $pYRANGE) {
global $SCJQ;
//==============================================================================
return
( "<script type='text/javascript'>"
.    "$(document).ready(function() {"
.       "$('#$pNAME').datepicker('option', 'yearRange', '$pYRANGE' );"
.       "$('#$pNAME').datepicker('setDate', '$pDATE');"
.    "});"
. "</script>"
. "<td class='Td_Memo' style='width:$pWIDTH;'>"
.    "<input name='$pNAME' type='text' style='width:$pWIDTH;' "
.    "maxlength='10' class='datepicker' id='$pNAME' >"
. "</td>"
);
} //---------------------------------------------------- sc_DatePicker ***END***

and here is at least the function call in the form.

   //--------------------------------------------------------------- FL_ValiDate
   "<td class='Td_Memo' style='width:68px;text-align:right;'>$w2</td>" .
   sc_DatePicker('FL_ValiDate', $tempFolder['FL_ValiDate'], '94px', 'c-0:c+2') ."</tr><tr>" .
   //---------------------------------------------------------------- FL_ExpDate
   "<td class='Td_Memo' style='width:68px;text-align:right;'>$w3</td>" .
   sc_DatePicker('FL_ExpDate', $tempFolder['FL_ExpDate'], '94px', 'c-0:c+5') .
"</tr></table>";
//======================================================================= LINE 3

i hope the description is useful and that you can help me.

Many thanks forward.

I have a draggable list on the page, whose items are connected to multiple sortable lists using 'connectToSortable'. When I drag the first element and drop in to one of the sortables, it works fine. But on subsequent operations, the drag/drop fails with the following errors in the FF (3.6.8) console.

Error: this.offsetParent[0] is undefined
Source File: http://www.ship.989studios.com/js/jquery/ui/jquery-ui-1.8.4.custom.js
Line: 3871

Error: scroll[0] is undefined
Source File: http://www.ship.989studios.com/js/jquery/ui/jquery-ui-1.8.4.custom.js
Line: 3960

After changing the method _getParentOffset in jquery-ui-1.8.4.custom.js as follows, it works fine. Is this a valid fix?

        _getParentOffset: function() {

                //Get the offsetParent and cache its position
                this.offsetParent = this.helper.offsetParent();
                var po = this.offsetParent.offset();

                // This is a special case where we need to modify a offset calculated on start, since the following happened:
                // 1. The position of the helper is absolute, so it's position is calculated based on the next positioned parent
                // 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't the document, which means that
                //    the scroll is included in the initial calculation of the offset of the parent, and never recalculated upon drag
                if(this.cssPosition == 'absolute' && this.scrollParent[0] != document && $.ui.contains(this.scrollParent[0], this.offsetParent[0])) {
                        po.left += this.scrollParent.scrollLeft();
                        po.top += this.scrollParent.scrollTop();
                }
                var isOffsetParentFound = (this.offsetParent != null && this.offsetParent[0] != null);

                if((this.offsetParent[0] == document.body) //This needs to be actually done for all browsers, since pageX/pageY includes this information
                || (isOffsetParentFound && this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() == 'html' && $.browser.msie)) //Ugly IE fix
                        po = { top: 0, left: 0 };
                if (po == null)
                {
                        po = { top: 0, left: 0 };
                }

                return {
                        top: po.top + (parseInt(this.offsetParent.css("borderTopWidth"),10) || 0),
                        left: po.left + (parseInt(this.offsetParent.css("borderLeftWidth"),10) || 0)
                };

        }

Thanks