如何在 Play framework 2.0 中切换表单元素的可见性？答案

【问题标题】：How to toggle form element visibility in Play framework 2.0?如何在 Play framework 2.0 中切换表单元素的可见性？
【发布时间】：2015-02-01 23:59:11
【问题描述】：

例如，我有一些看起来像这样的表格：

@main{
    <fieldset>
    @inputText(myForm"Id"),'_label -> "Id")
    @checkbox(myForm("isEnabled"))
    @inputText(myForm("someOptionvalue"))
    </fieldset>
}

我需要的是，如果选中 isEnabled - someOptionValue inputText 应该显示。此复选框只是一个示例，它可以是任何其他元素。我想知道如何根据其他元素显示\隐藏元素。对不起，我的英语不好。希望有人能帮忙。

添加我想我应该使用java脚本，但我不知道如何在播放视图模板中注入js函数

【问题讨论】：

标签： html scala playframework-2.0

【解决方案1】：

您使用的 Play 表单元素是用于生成纯 html 的 Play Scala 模板。

出于您的目的，我认为您应该像使用任何 html 表单一样使用 javascript。一个例子是：

<script type="text/javascript">
  window.onload = function(e) {
    document.getElementById("myCheck").onclick = function() { 
      showHideElement();
    };
    showHideElement();
  }

  function showHideElement() {
    var checked = document.getElementById("myCheck").checked;
    var el = document.getElementById("myOptionValue");
    if (checked) {
      el.style.display = 'block'
    } else {
      el.style.display = 'none'
    }
  }
</script>

您的复选框和输入文本模板都应添加 id 属性，例如：

  @checkbox(myForm("isEnabled"), 'id -> "myCheck")
  @inputText(myForm("someOptionvalue"), 'id -> "myOptionValue")

仅供参考，您可以在上面的标签中添加更多属性，例如 CSS 样式类，例如：

@inputText(myForm("name"), 
'id -> "username", 
'class -> "classForInputText",
'_id -> "idForTheTopDlElement",
'_class -> "classForTheTopElement",
'size -> 30
)

然后您可以将显示设置为无或阻止

【讨论】：