提交表单时，输入文本字段自动完成不接受数据

Question

我有一个输入数据登录：用户名和密码并提交按钮。像这样。

那里的文本字段由 Chrome 填充，但是当我使用该信息进行登录过程时，就像没有数据一样。我必须重写文本字段中的所有信息。我希望将此信息用于登录过程。 我该怎么做？

控制器类：

public class LoginController extends SelectorComposer<Component>{
    //Wire Components
    @Wire
    private Textbox user;
    @Wire
    private Textbox password;
    @Wire
    private Label message;

    private AuthenticationService serviceAuth = new AuthenticationService();

    /*
     * Method:  doLogin
     * Details: Login function with the data provided: User and password
     * 
     */
    @Listen("onClick=#loginButton")
    public void doLogin(){
        String userName = user.getValue();
        String pass = password.getValue();

        //Now we use the Authenthication service
        if(!serviceAuth.login(userName, pass)){
            message.setValue("Datos ingresados son incorrectos");
            return;
        }

        UserCredential tmpCred = serviceAuth.getUserCredential(); //check
        message.setValue("Bienvenido, "+userName);
        Executions.sendRedirect("/inquiries.zul");
    }
}

Answer 1

这可能听起来很奇怪，但您可以尝试以下方法：

<textbox value="@bind(vm.userName) @save(vm.userName, before='submit')"/>
<button onClick="@command('submit')"/>

像这样，您将在保存之前再次持久化文本框中的数据。

编辑：

所以我搜索了一下，发现了一些“hack”。
请注意，问题来自 Chrome 本身，它不执行 onChange 事件。

所以我想出了以下内容：

<window id="win" border="normal" title="hello" apply="be.chillworld.LoginController" xmlns:w="http://www.zkoss.org/2005/zk/client" >
     <vlayout>
        <textbox id="user"/>   
        <textbox id="password" type="password"/>
        <button label="login" id="loginButton" w:onClick="persistValuesToServer()"/>   
        <script type="text/javascript">
            function persistValuesToServer()
            {
            zAu.send(new zk.Event(zk.Widget.$('win'), 'onUser', jq('$user').val()));
            zAu.send(new zk.Event(zk.Widget.$('win'), 'onPass', jq('$password').val()));
            }
        </script>
    </vlayout>  
</window>


public class LoginController extends SelectorComposer<Component> {

    @Wire
    private Textbox user;
    @Wire
    private Textbox password;

    @Listen("onUser=#win")
    public void autoFillUser(Event e) {
        user.setValue(String.valueOf(e.getData()));
    }

    @Listen("onPass=#win")
    public void autoFillPass(Event e) {
        password.setValue(String.valueOf(e.getData()));
    }

    @Listen("onClick=#loginButton")
    public void doLogin() {
        System.out.println(user.getValue() + " : " + password.getValue());
    }
}

小解释：
当我们按下按钮时，我们的 JavaScript 将首先被触发 =>，我们将向控制器发送 2 个事件（1 个用于用户名，1 个用于密码），其中包含实际文本框中的数据。
在控制器中，我们将正确的数据放入文本字​​段中，然后处理真正的登录事件。

这是完美的解决方案吗？ 当然不是，但是当我们按下按钮时，它的工作开销很小。