Question

我正在使用tapestry 5.3.3（包括问题＃1844的补丁）......

是否有一种简单的方法来捕获和处理'onchange'事件，即用户选择新日期（通过弹出窗口）？

我试过了：

<t:datefield value="dateValue" onchange="alert('here');" />

谢谢，保罗。

Answer 1

您可以在输入字段中捕获更改事件。如果你正在使用原型试试这个：

$('dateFieldId').observe('change', function(){
    alert('gotcha!');
    ...do whatever you will ...
});

我发现将此js添加到您的页面的最佳方法是使用添加到您的页面/组件的单独的js文件，使用@Import注释为您的页面/组件添加：

Tapestry.Initializer.FieldChangeObserver = function (parameters) {
    new FieldChangeObserver (parameters);
};

var FieldChangeObserver  = { };
FieldChangeObserver  = Class.create({
    initialize:function(parameters) {
    $(parameters.dateFieldId).observe('change', function(){
            alert('gotcha!');
            ...do whatever you will ...
        });
    }
});

然后在您的页面/组件中，您可以：

@Inject
private JavaScriptSupport javaScriptSupport;

@Component
private DateField dateField;

@AfterRender
private void afterRender() {
    JSONObject params = new JSONObject()
    params.put("dateFieldId", dateField.getCLientId());
    javaScriptSupport.addInitializerCall("FieldChangeObserver", params);
}

免责声明：我很快写完了，没有测试代码。

Answer 2

似乎我必须结合两种方法来实现我所需要的 - 无论是否应该在挂毯框架内进行改进都需要辩论......

<t:datefield t:id="selectedDateElem" id="selectedDateElem" onchange="alert('1 onchange attribute');" />

    $("selectedDateElem").observe("change", function(event)
        {
            alert("2 change observer");
        });

    document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
        {
            if (Tapestry.currentFocusField && Tapestry.currentFocusField.id == "selectedDateElem")
                alert("3 focus change observer");
        });

测试案例1：

用户点击输入字段
用户更改输入字段的值
用户点击输入字段
- ＆GT; “1 onchange属性”＆amp; “2改变观察者”

测试案例2：

用户点击了datepicker图标
用户从弹出窗口中选择一个新日期
- ＆GT; “3焦点改变观察者”

因此onchange属性等同于更改观察者，因此唯一完整的解决方案是将方法2和方法结合起来。 3：

     $("selectedDateElem").observe("change", function(event)
        {
            Page.dateFieldChanged();
        });

    document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
        {
            if (Tapestry.currentFocusField && Tapestry.currentFocusField.id == "selectedDateElem")
                Page.dateFieldChanged();
        });

datefield onchange处理程序，仅限客户端

2 个答案: