Tridion日期选择器 - 访问事件

时间:2012-10-02 13:39:18

标签: user-interface tridion tridion2009

我将Tridion Date控件添加到我创建的GUI扩展.aspx页面中。

我已使用

将其添加到ASPX页面
<c:Date id="AdjustDate" runat="server" 
IsSeparateFields="false" AddClearButton="false" TabIndex="3"></c:Date>

在我的.JS中我添加了以下内容

  1. 让我处理Tridion日期控制(选择日期值等)。

    c.AdjustDate = $ controls.getControl($( “#AdjustDate”), “Tridion.Controls.Date”)

  2. 捕获日期中的更改(在用户在模态对话框中选择“确定”后)

    $ evt.addEventHandler(c.AdjustDate,“change”, this.getDelegate(this._onHighlightDateChange));

  3. 我捕获事件并根据所选日期执行一些更新。

    但是,我的GUI扩展对话框的高度小于显示模式对话框时的高度。当用户点击Select Date并显示模态对话框时,我希望调整ASPX对话框的大小。

    我现在已经捕获了用户点击Select Date按钮

    的事件
    c.BtnDateSelect = $controls.getControl($("#AdjustDate_selectbutton"),
    "Tridion.Controls.Button");
    $evt.addEventHandler(c.BtnDateSelect, "click", 
    this.getDelegate(this._onDateButtonClicked));
    

    但是 - 我似乎无法访问生成的对话框的高度,因为我无法添加任何事件来配合

    1. 打开对话框本身
    2. 用户单击“确定”或“取消”(再次调整高度)或
    3. 关闭模式对话框
    4. 我是否错过了与之相关的活动?

      我尝试使用

      创建一个OK按钮的句柄
      BtnDateOKSelect = 
      $controls.getControl($("html#DatePickerPopup.popup body center div#buttonContainer div#ButtonOk.tridion"),
       "Tridion.Controls.Button");
      

      但引用(及其变体)返回undefined - 可能是因为这是在iframe中,所以脚本无法访问它?

      有关计算我可以绑定的事件的任何指示? 如何与这些事件(以及何时)结合?

      由于

1 个答案:

答案 0 :(得分:3)

打开后无法调整对话框(模态)的大小。我写了一个扩展,我有一个类似的问题,当我的日期选择器在我的模态对话框上时,它看起来很奇怪,所以我使对话日期选择器更大。

但是我没有使用日期选择器控件,而是使用常规的html按钮。代码如下:

所以我检索按钮并添加处理程序以显示日期选择器:

c.BtnStartDate = $controls.getControl($("#startDate"), "Tridion.Controls.Button");
$evt.addEventHandler(c.BtnStartDate, "click", this.getDelegate(this._onStartDateButtonClicked));

这是事件中的代码:

SetDateRange$_onStartDateButtonClicked(event) {    
    this._setDate(event, "#startDate");

};

和setDate函数:

SetDateRange.prototype._setDate = function SetDateRange$_setDate(event, controlSelector) {
    var p = this.properties;
    var currentDate = new Date();
    var c = p.controls;


    p.datePickerPopup = $popup.create(
        $cme.Popups.DATE_PICKER.URL, {
            width: 550,
            height: 350
        },
        {
            date: currentDate,
            popupType: Tridion.Controls.Popup.Type.MODAL_IFRAME
        }
    );

    function SetDateRange$DatePicker$onPopupCanceled(event) {
        if (p.datePickerPopup) {
            p.datePickerPopup.dispose();
            p.datePickerPopup = null;
        }
    }

    function SetDateRange$DatePicker$onPopupSubmitted(event) {
        var value = event.data.date;
        if (value) {
            var value = new Date(value);

            value = $localization.getFormattedDateTime(value, Tridion.Runtime.LocaleInfo.fullDateTimeFormat);
            jQuery(controlSelector).trigger('setdate', [value]);
        }
        p.datePickerPopup.dispose();
        p.datePickerPopup = null;
    }

    $evt.addEventHandler(p.datePickerPopup, "unload", SetDateRange$DatePicker$onPopupCanceled);
    $evt.addEventHandler(p.datePickerPopup, "submit", SetDateRange$DatePicker$onPopupSubmitted);
    $evt.addEventHandler(p.datePickerPopup, "close", SetDateRange$DatePicker$onPopupCanceled);

    p.datePickerPopup.open();
};

同样,它可能不是您的方案的解决方案,但此示例显示如何打开日期选择器对话框并使用它返回的值,而不使用“Tridion日期选择器控件”。

希望这有帮助。