Scala Play 表单答案

【问题标题】：Scala Play formsScala Play 表单
【发布时间】：2017-04-13 10:57:53
【问题描述】：

我有一个无法解释的奇怪问题。我正在使用播放框架，当我尝试运行下面的视图时，它仅在我重复下面的表单操作时才有效……它有效，但我知道这是不对的。如果有人可以帮助解释或更正，不胜感激。

@(errorMessage: String = "")(implicit messages: Messages)

@helper.form(routes.ApplicationHomeController.login) {
    @main(title = messages("single.title")) {
        <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,700" rel="stylesheet" type="text/css">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <div id="userbox">
            <form action="@{routes.ApplicationController.doLogin()}" method="post"></form>

            <form action="@{routes.ApplicationController.doLogin()}" method="post">
                <div style="color: red">@errorMessage</div>
                <h1 id="logintxt" style="background-color: rgb(11, 146, 9);
                            background-position: initial;
                            background-repeat: initial;">Driver Service <b>ß</b>eta</h1>

                <div id="submit_giff" style="display: none;">
                    <hi> Authenticating: <img src="/assets/images/loader-bar.gif" align="absmiddle">  </hi>
                </div>
                <input id="name" name="userName" placeholder="Username" style="opacity: 1;
                            background-color: rgb(255, 255, 255);
                            background-position: initial;
                            background-repeat: initial;">
                <input id="pass" name="password" type="password" placeholder="Password" style="opacity: 1;
                            background-color: rgb(255, 255, 255);
                            background-position: initial;
                            background-repeat: initial;">

                <p id="namealert" style="display: none;
                            opacity: 1;">Username:</p>
                <p id="passal" style="display: none;
                            opacity: 1;">Password:</p>
                <input id="loginbtn" style="opacity: 0.2;
                            cursor: default;" type="submit" value="Login">
            </form>
        </div>
        <script src="/assets/javascripts/login.js"></script>
    }
}

【问题讨论】：

标签： scala playframework twirl

【解决方案1】：

两个直接的观察结果。

一：@helper.form(...) 会将<form> 元素写入最终生成的 HTML。然后，您的视图包括嵌套在 inside 第一种形式的其他文字 <form>s。 Nested forms are invalid HTML。您有一个表单提交给routes.ApplicationController.doLogin，另一个提交给routes.ApplicationController.login。谁知道浏览器将实际提交给其中的哪一个？我们无法真正预测，因为嵌套形式无效。

二：你的@main(...) 视图嵌套在内你的@helper.form(...)。我假设您的主视图包含<html>...</html>。这将导致 HTML 以 <form> 元素开头，inside 是 <html> 元素。这也是非常无效的标记。

我的猜测是这些问题中的一个或两个都是你的问题。

尝试使用您生成的 HTML 并通过 HTML 验证器（如 https://validator.nu/）运行它。修复验证器发现的任何问题，不要嵌套表单，并决定登录表单应该实际提交到哪个（单个）路由。

【讨论】：