表单填写游戏框架scala不起作用

时间:2017-02-03 18:15:50

标签: scala playframework

我正在创建一个包含员工列表的应用程序。管理员可以查看员工列表并更改其数据。当他点击"改变"按钮,html表单应该填充选定的员工数据,以便他可以更改它。我在play框架中使用了标准机制,但它不起作用。我正在调试它,一切看起来都不错(员工数据设置为表格)但它没有显示在我的html表单上......我不明白为什么......

  def loadEmployee(id: Int) = Action { implicit request =>
    val loadedEmployee = EmployeeService.getEmployee(id)
    val employee = Await.result(loadedEmployee, Duration(5, SECONDS)).get

    val employees = Await.result(EmployeeService.listAllEmployees, Duration(5, SECONDS))

    val form = EmployeeForm.form.fill(EmployeeFormData(employee.name, employee.additionalInformation, employee.resume))

    Ok(views.html.index(form,employees))
  }

查看文件:

@(employeeForm: Form[models.EmployeeFormData],employees : Seq[models.Employee])
@main() {


    <form id="employee-data-form" role="form" action='@routes.ApplicationController.addInformation()' method="post" class="form-horizontal" align="center" autocomplete="off">

        <fieldset class="employee-fieldset">

            <div class="employee-form">
                <label class="form-title" style="color: #F8741B; font-size: 22px;font-weight: bold; text-decoration:none">title</label>
            </div>
            <br/>
            <table align="center" cellspacing="20">
                <tr>
                    <td align="left">
                        <div class="employee-form" id="name_field_label">
                            <div class="controls col-xs-offset-3 col-xs-9">
                                <div class="input-group">
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>
                                    <strong>name</strong> :
                                </div>
                            </div>
                        </div>
                    </td>
                    <td align="center">
                        <div class="employee-form" id="name_field_value">
                            <div class="controls col-xs-offset-3 col-xs-9">
                                <div class="input-group">
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>                               
                                    <input type="text" id="name" name="name" value="" placeholder="First Name" class="form-control input-lg" required>                                
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td align="left">
                        <div class="employee-form" id="additionalInformation_field_label">
                            <div class="controls col-xs-offset-3 col-xs-9">
                                <div class="input-group">
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>
                                    <strong>Additional information</strong> :
                                </div>
                            </div>
                        </div>
                    </td>
                    <td align="center">
                        <div class="employee-form" id="additionalInformation_field_value">
                            <div class="controls col-xs-offset-3 col-xs-9">
                                <div class="input-group">
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>
                                    <textarea rows="4" cols="50" id="additionalInformation" name="additionalInformation" value="" class="form-control input-lg" required></textarea>
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td align="left">
                        <div class="employee-form" id="resume_field_label">
                            <div class="controls col-xs-offset-3 col-xs-9">
                                <div class="input-group">
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>
                                    <strong>resume</strong> :
                                </div>
                            </div>
                        </div>
                    </td>
                    <td align="center">
                        <div class="employee-form" id="resume_field_value">
                            <div class="controls col-xs-offset-3 col-xs-9">
                                <div class="input-group">
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>
                                    <textarea rows="4" cols="50" id="resume" name="resume" class="form-control input-lg" required></textarea>
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>

            </table>
            <br/>
            <div class="form-actions controls ynt-btn-xlarge">
                <button type="submit" class="btn btn-primary ynt-btn-orange">Add</button>
            </div>

        </fieldset>
    </form>

    <div class="employee-display" >
        <fieldset>
            <legend align="center"><h3>Registered Employees</h3></legend>
            <table cellspacing="20">
                <tr>
                    <th>employeeid</th>
                    <th>firstname</th>
                    <th>lastname</th>
                    <th>resume</th>
                </tr>
                @for(employee <- employees){
                    <tr>
                        <td>@employee.id</td>
                        <td>@employee.name</td>
                        <td>@employee.additionalInformation</td>
                        <td>@employee.resume</td>
                        <td><a href="@routes.ApplicationController.deleteEmployee(employee.id)">delete</a></td>     
                        <td><a href="@routes.ApplicationController.loadEmployee(employee.id)">loadEmployee</a></td>                   
                    </tr>
                    }
            </table>
        </fieldset>
    </div>

}

1 个答案:

答案 0 :(得分:1)

您的控制器代码看起来没问题 - 您fill Form[EmployeeFormData]并将其传递给您的模板。麻烦的是,你永远不会在模板中使用你的employeeForm - 这种形式无法填充。

如果您阅读了showing forms in a view template的Play文档,您会发现有helper整个系列可用于此目的。在许多情况下,它们几乎和简单的HTML&#34;像你这样的版本。这是一个例子:

您的位置

<div class="input-group">
  <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>
  <input type="text" id="name" name="name" value="" placeholder="First Name" class="form-control input-lg" required>
</div>

您需要

<div class="input-group">
  <span class="input-group-addon"><span class="glyphicon glyphicon-employee"></span></span>
  @helper.inputText(
    employeeForm("name"),
    'id -> "name",
    'placeholder -> "First Name",
    'class -> "form-control input-lg",
    'required -> "true"      
  )
</div>

注意如何通过在'字符前面添加任意数量的任意参数到生成的HTML中。这可能非常方便,例如,如果您想在输入上设置额外的data-属性。