Wicket 口用例 : form with some positive feedback, 例如忘记密码请求

Question

使用 wicket 制作表格以产生一些积极的反馈信息的最佳做法是什么？

示例:我有一个表单，用户可以在其中请求更改忘记密码的链接。用户将此链接发送到他给定的电子邮件地址(像往常一样)。

如果用户在表单中输入他的(有效)电子邮件地址并按下提交按钮，我想显示一个积极的反馈消息，例如:“一封更改密码的邮件将发送到您的邮件地址”。

我看到以下选项可以做到这一点:

使用此消息的反馈面板(作为“信息”)，但使用表单的反馈面板，表单仍然存在(并且可能处于事件状态)，这不太好......

重定向到只显示此消息的页面。仅用于此消息的新页面不是很“像 wicket ”，是吗？

使用模态窗口。 (但在这种情况下，这不适合我的设计。)

有任何想法吗？蒂亚!

Answer 1

我认为这是关于你的设计愿景，而不是关于 wicket 。

1)在我们的应用程序中，我们通常使用模态窗口作为“密码恢复”表单，当用户提交此表单时，模态窗口正在关闭并且通过ajax调用的javascript div出现(像另一个窗口，但带有静态)。 IE。我们的基页 html 上有这样的 div:

<div class="message-dialog" id="dialog_window">
    <p id="dialog_window_p">[MESSAGE HERE]</p>
    <a class="w_close"></a>
</div>

一些javascript函数:

    //function to show div as window.
    function showNotification(message) {
        var msg = message;
        $("#dialog_window_p").html('<span>' + msg + '</span>');
        $('#dialog_window a.w_close').show();
        $("#dialog_window").fadeIn(300);
    }

    //set listener to close link. may be you could use plain onclick="..", can't remember why we done so.
    $(document).ready(function() {
        $("#dialog_window a.w_close").click( function(){
            $("#dialog_window").fadeOut(300);
        });
    });

和风格:

.message-dialog {
    display:none;
    max-width: 600px;
    height: auto;
    padding: 30px;
    position: absolute;
    left: 35%;
    top: 35%;
    border: 1px solid #969696;
    border-radius: 4px;
    z-index: 100000;
}

可能这有点笨拙，但我不擅长 js 和 css。您也可以设置一些变量，例如 passwordRestored = true在您的 session 中并在提交后重定向到主页。创建主页时，您检查此变量，如果它是 true - 显示此弹出窗口并将此变量设置回 false .

2)许多站点在用户提交到另一个页面后重定向用户，因此这种方法是可行的，但您也可以使用 AJAX 来隐藏表单并显示带有成功消息(或反馈面板)的隐藏跨度。要使用 AJAX，您必须替换您提交的 Button使用 'AjaxButton' 需要覆盖 onClick(AjaxRequestTarget target) 方法。在这种方法中，您可以执行以下操作:

 onClick(AjaxRequestTarget target) {
    if (submitionCorrect)
    {
        form.setVisible(false);
        successLabel.setVisible (true);
        target.add (form, successLabel);        
    } else {...}
 }

并且不要忘记设置 form和 successLabel .setOutputMarkupPlaceholderTag (true) .

3)如果您不想使用这种方法之一 - 我认为唯一的方法是在您的表单中向用户询问电话号码并在提交后向他发送短信:D