3

我是 Lift 的新手,我有一个关于在 Lift 中使用 bind、Ajax 的问题。

我想以动态方式使用 Ajax 创建三个下拉菜单。我以“地址”为例来描述我想要实现的目标。首先,我只需要显示默认设置为“无”的“国家”菜单。此时用户可以选择提交,如果她愿意,地址被视为默认值。如果没有,她可以提供准确的地址。一旦她选择了国家,就会显示“州”菜单,一旦她选择了“州”,就会显示“县”菜单。

在电梯演示示例的帮助下,我尝试创建如下静态菜单。我在我的 .html 文件和 scala 代码中创建了三个片段<select:country/>, <select:state/>, <select:county/>,我绑定如下:

bind("select", xhtml,
     "system" -> select(Address.countries.map(s => (s,s)),
                       Full(country), s => country = s, "onchange" -> ajaxCall(JE.JsRaw("this.value"),s => After(200, replaceCounty(s))).toJsCmd),
     "state" -> stateChoice(country) % ("id" -> "state_select"),
     "county" -> countyChoice(state) % ("id" -> "county_select"),
     "submit" -> submit(?("Go!"),()=>Log.info("Country: "+country+" State: "+state + " County: "+ county)

对应的replaceCounty、stateChoice、countyChoice都是在我的类中定义的。However, when the country is selected, only the state is refreshed through Ajax call and not the county.

Q1) 有没有办法根据国家菜单刷新两个菜单?

Q2) 如前所述,如何动态创建菜单?

4

2 回答 2

3

有一个很好的示例代码可以做到这一点:

http://demo.liftweb.net/ajax-form

如果您想通过 AJAX 更新来更新多个下拉菜单,您需要返回如下内容:

ReplaceOptions(...) & ReplaceOptions(...)
于 2011-01-25T19:51:46.060 回答
1

用于SHtml.ajaxSelect您的第一个选择,其他两个使用静态元素。当第一个选择更改时,您将返回 javascript 以使用另一个 SHtml.ajaxSelect 调用的结果填充下一个选择。

def countrySelect : NodeSeq = {
  val countryOptions = List(("",""),("AR","AR"))
  SHtml.ajaxSelect(countryOptions, Empty, { selectedCountry => 

    val stateOptions = buildStateOptions(selectedCountry)
    SetHtml("state-select", SHtml.ajaxSelect(stateOptions, Empty, { selectedState =>
      // setup the county options here.
    }))

  })
}

bind(namespace, in,
  "country" -> countrySelect,
  "state" -> <select id="state-select"/>,
  "county" -> <select id="county-select"/>)

在#ajaxSelect 的回调中,您可能希望保存已选择的值,但这是我采用的一般方法。

于 2010-11-06T18:09:40.580 回答