3

私は Lift の初心者で、Lift で bind や Ajax を使用することについて質問があります。

Ajax を動的に使用して 3 つのドロップダウン メニューを作成したいと考えています。私が達成しようとしていることを説明するために、例として「アドレス」を使用します。最初は、「国」メニューを表示し、デフォルトを「なし」に設定するだけです。この時点で、ユーザーは必要に応じて送信することを選択でき、アドレスがデフォルトとして使用されます。そうでない場合は、正確な住所を提供できます。国を選択すると「State」メニューが表示され、「State」を選択すると「County」メニューが表示されます。

リフトのデモ例を参考に、以下のように静的メニューを作成してみました。.html ファイルと scala コードに3 つのスニペットを作成<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 はすべて、私のクラスで定義されています。ただし、国を選択すると、Ajax 呼び出しによって州のみが更新され、郡は更新されません。

Q1) 国のメニューに基づいて両方のメニューを更新する方法はありますか?

Q2) 先ほど説明したメニューを動的に作成するにはどうすればよいですか?

4

2 に答える 2

3

これを行う優れたサンプル コードが次の場所にあります。

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

AJAX 更新の結果として複数のドロップダウンを更新する場合は、次のようなものを返します。

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

最初の選択に使用SHtml.ajaxSelectし、他の 2 つの静的要素に使用します。最初の選択が変更されたら、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 に答える