Динамическое связывание в рамках Lift - PullRequest
Новая
       9

Динамическое связывание в рамках Lift

3 голосов
/ 26 мая 2010

Я новичок в Lift, и у меня есть вопрос об использовании bind, Ajax в Lift.

Я хочу создать три выпадающих меню с использованием Ajax в динамическом режиме. Я использую «Адрес» в качестве примера, чтобы описать то, что я пытаюсь достичь. Во-первых, мне нужно только отобразить меню «Страна» со значением по умолчанию «Нет». Пользователь в этот момент может выбрать отправку, если он хочет, и адрес принимается по умолчанию. Если нет, она может предоставить точный адрес. Как только она выберет страну, должно отобразиться меню «Штат», а после выбора «Штат» должно появиться меню «Округ».

С помощью демонстрационных примеров лифта я попытался создать статические меню следующим образом. Я создал три фрагмента <select:country/>, <select:state/>, <select:county/> в своем файле .html и в коде scala связываю следующим образом: 

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) Как создать меню динамически, как я объяснил ранее?

Ответы [ 2 ]

3 голосов
/ 25 января 2011

Отличный пример кода, который делает это, доступен по адресу:

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

Если вы хотите обновить несколько раскрывающихся списков в результате обновления AJAX, вам нужно вернуть что-то вроде: 

ReplaceOptions(...) & ReplaceOptions(...)
1 голос
/ 06 ноября 2010

Используйте 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 вы, вероятно, захотите сохранить значенияиз всего, что было выбрано, но это общий подход, который я бы выбрал.

...