inputFiledコンポネットを使って、データタイプは日付・時間の場合、項目はonFocusの場合、Calendarを表示する

でも、一括入力画面など実装する場合、一列の項目は凄く多いので、下記方法で、横Scrollで画面を実装する

その場合、予想外問題が発生しました、ポップアップのCalendar位置は崩れた、原因を調べると、SalesforceのCalendarの表示位置の設定はOffset利用して、設定されているので、Scroll存在するDiv中に、Calendarの位置計算が問題ありました、そのため、offsetじゃなく、postionで利用して、Calendar表示位置を再設定を行う

改修方法：いろいろ方法をためました、最後、直接SalesforceのMain.jsのCalendarのPostion取得Methodを上書して、対応しました

詳しく方法は下記様に作る

CssでCalendarのPostion設定修正

.datePicker {

   position:fixed;

}

// Salesforce Main.jsのMethod Modify DatePicker.prototype.position = function() { // 個別位置計算必要フラグを設定する var specialProcFlg = (this.myElement.id.indexOf(“:departTime”) >=0 || this.myElement.id.indexOf(“:timeofEntry”) >=0 || this.myElement.id.indexOf(“:entryTime”) >=0); // 個別処理 if (specialProcFlg) { a = $j(this.myElement).position().left; for (var b = 0, c = this.myElement; c != null && c != this.calendarDiv.offsetParent;) { //a += c.offsetLeft; b += c.offsetTop; c = c.offsetParent } } else { for (var a = 0, b = 0, c = this.myElement; c != null && c != this.calendarDiv.offsetParent;) { a += c.offsetLeft; b += c.offsetTop; c = c.offsetParent } } if (getObjY(this.myElement) + this.calendarDiv.offsetHeight > getScrollY() + getWindowHeight()) b -= this.calendarDiv.offsetHeight; else b += this.myElement.offsetHeight; c = “left”; if (LC.isRtlPage()) { c = “right”; a = this.calendarDiv.offsetParent.offsetWidth – a – this.myElement.offsetWidth } this.shim.setStyle(c, a + “px”); this.shim.setStyle(“top”, b + “px”) }