Question

使用wicket表单的最佳做法是什么，会产生一些积极的反馈信息？

示例：我有一个表单，用户可以请求链接更改其忘记的密码。用户将此链接发送到他给定的电子邮件地址（照例）。

如果用户在表单中输入了他的（有效）电子邮件地址并按下提交按钮，我想显示一条正反馈消息，例如：“更改密码的邮件将发送到您的邮箱地址”。< / p>

我看到以下选项来执行此操作：

使用反馈面板显示此消息（作为“信息”），但使用表单的反馈面板，表单仍然存在（并且可能处于活动状态）并且不太好......
重定向到只显示此消息的页面。仅针对此消息的新页面不是“类似于门票”，是吗？
使用模态窗口。（但这不适合我的设计。）

有什么想法吗？ TIA！

Answer 1

这是关于你的设计愿景，而不是关于检票口。我想。

1）在我们的应用程序中，我们通常使用模态窗口进行＆＃34;密码恢复＆＃34;表单，当用户提交此表单时，然后模态窗口关闭，并且通过ajax调用javascript div（如另一个窗口，但有静态）。即我们的基页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，然后在submition后重定向到主页。创建主页时，请检查此var以及是否为true - 显示此弹出窗口并将此var设置回false。

2）许多网站在提交到另一个网页后重定向用户，因此这种方法是可行的，但您也可以使用AJAX隐藏表单并显示隐藏的跨度和成功消息（或反馈面板）。要使用AJAX，您必须替换为使用＆＃39; AjaxButton＆＃39;提交Button。这需要覆盖onClick（AjaxRequestTarget目标）方法。在这种方法中你可以这样做：

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

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

3）如果您不想使用这种方法之一 - 我只能在您的表单上询问用户的电话号码，并在提交后向他发送短信：D

wicket用例：带有一些积极反馈的表格，例如：忘记密码请求

1 个答案: