Twirl повторяет поле формы только первые обновления кнопки

Question

Я прикрепил изображение моего интерфейса, созданного с помощью следующего кода шаблона twirl:

@(interests:List[String],levelsForm: Form[ManyInterests],user:models.User)(implicit request: RequestHeader,messages: Messages)

@import helper._
@import play.api.Play.current


@import b3.vertical.fieldConstructor
@opts = @{ Seq("1"->"Not very passionate","2"->"A little passionate",
    "3"->"Moderately passionate","4"->"Very passionate","5"->"Extremely passionate") }

@main("Passion Levels",Some(user)) {
    <h3>For each of the previous entered interest and activities, please rate how passionate you are:
    </h3>
    @helper.form(action = routes.ResponseController.newPassion) {
    @interests.map { interest =>
            <span><b>@interest</b></span><br />
        @b3.radio(levelsForm("interestpassions"), options = opts,'_inline ->true)
    }
        @b3.buttonType("submit", 'class -> "btn btn-default"){Next}
    }
}

Он генерирует правильное сопоставление переключателей для значения, извлеченного из запроса pgsql, но проблема, с которой я сталкиваюсь, заключается в том, что когда я нажимаю на ЛЮБОЙ переключатель, единственная строка, в которой отображаются изменения, - это самая первая строка. Таким образом, чтобы объяснить использование изображения, если я выберу "Очень страстный" для игры в футбол, радио-кнопка не отображает запись здесь, но выбор для первой страсти "s" меняется на "Очень страстный".

Я не уверен, как это исправить. Я использую play-bootstrap3, который отлично работает для всех моих других компонентов формы.

Answer 1

Это выглядит правильно. Ты используешь @b3.radio(levelsForm("interestpassions")... для всех ваших полей, поэтому все они привязаны только к одному полю формы - "процентным интересам".

Я не уверен насчет фреймворка 'play-bootstrap3', но в тривиальных помощниках по игровой форме вам нужно использоватьrepeat для генерации повторяющихся полей:

@helper.repeat(userForm("emails"), min = 1) { emailField =>

    @helper.inputText(emailField)

}

Answer 2

Спасибо... я в конечном итоге воспользовался подсказкой из блога в Интернете и пошел с этим кодом:

 @helper.form(action = routes.ResponseController.newPassion) {

        @for(i <- 0 to interests.length - 1) {
            @defining(i) { count =>
                @defining(interests(i)) { interest =>
                        <span><b>@interest.interest</b></span><br/>
                @b3.text(levelsForm("interestpassions["+count+"].interest"), 'value -> s"${interest.interest}")
                @b3.radio(levelsForm("interestpassions["+count+"].level"), options = Seq("1" -> "Not very passionate", "2" -> "A little passionate",
                    "3" -> "Moderately passionate", "4" -> "Very passionate", "5" -> "Extremely passionate"),'_label -> s"", '_inline -> true, 'value -> s"${interest.passionLevel}")
                }
            }
        }
        @b3.buttonType("submit", 'class -> "btn btn-default"){Next}
    }
}

Я использовал некоторые jQuery, чтобы скрыть текстовое поле ввода, так как это значение jsut извлекается из того, что пользователь ответил на предыдущий вопрос, как вопрос. поэтому ответ от предыдущего будет вставлен в качестве идентификатора для другой таблицы в pgsql. Я думаю, что мои определения класса дел были большей проблемой, чем сами шаблоны twirl.