Блог

Главная - Вопросы по программированию - Как заполнить тег select в HTML в JSF 2?

Как заполнить тег select в HTML в JSF 2?

#jsf #jsf-2

#jsf #jsf-2

Вопрос:

У меня есть этот код, который отлично работает в HTML, как вы можете видеть, но как получить значения <select /> тега для вставки в мой компонент?

Что-то вроде этого:

 <h:outputLabel for="state" value="State:" />
<h:selectOneMenu id="state" value="#{bean.state}" />

Я пробую много вещей, но пока ничего.
Есть идеи?

Ответ №1:

Это не сработает. JSF должен знать обо всех раскрывающихся элементах.

Либо используйте простой HTML <select> -элемент вместо <h:selectOneMenu> и извлеките отправленное значение с помощью @ManagedProperty или <f:viewParam> , либо перенесите этот JS-код в вспомогательный bean-код JSF, чтобы его можно было использовать <f:selectItems> . Вы можете использовать <f:ajax> для заполнения и отображения 2-го выпадающего списка.

Комментарии:

1. Я решил установить эти значения в вспомогательном компоненте, как вы предлагаете.

2. Только один вопрос @BalusC, что вы используете для автоматического заполнения поля country, state, city?

3. Просто JSF с <f:ajax> данными и данными в области приложения.

4. Я имею в виду некоторые API, которые предоставляют такого рода услуги.

5. Вы имеете в виду, чтобы получить данные? До сих пор мы всегда сохраняли страны / штаты (но не города) самостоятельно. У меня еще не было проекта, который также требует выпадающего списка городов (было бы слишком много работы для самостоятельного сбора и обслуживания). Что касается сторонних API, я только когда-либо слышал о Yahoo PlaceFinder. Обратите внимание, что в вашем коде JavaScript все эти штаты / города жестко закодированы в .js файле.

Ответ №2:

Функции Javascript, похоже, принимают id s из select s.

Если вы это сделаете <h:form prependId="false"> , и <h:selectOneMenu id="city" тогда «город» будет id select отображен JSF. Просто передайте это id функциям.

 <h:form prependId="false">
    <h:selectOneMenu id="city" value="#{bean.selectedCity}">

    </h:selectOneMenu>

    <h:selectOneMenu id="state" value="#{bean.selectedState}">

    </h:selectOneMenu>
</h:form>

<script language="JavaScript" type="text/javascript" charset="utf-8">
    $(document).ready(function() {
        new dgCidadesEstados({
            cidade: document.getElementById('city'),
            estado: document.getElementById('state')
        });
    });            
</script>

Комментарии:

1. Не будет работать. В конечном итоге вы получите Validation error: Value not valid , когда форма будет отправлена, потому что список элементов не известен JSF.

2. @BalusC: Да, Балуск, он заполняет значения, но заканчивается ошибкой, о которой вы упомянули при отправке. 1 за ваше решение и спасибо.

Ответ №3:

Вам нужно использовать <h:selectItems> tag. Хорошее введение здесь и здесь .

Комментарии:

1. но как мне заполнить их через javascript?

Ответ №4:

У меня есть глупая (или забавная) идея, когда я интегрирую CKEditor в JSF (посмотрите, это замечательно).

Таким образом, CKEditor не поддерживает JSF полностью, но он поддерживает сами HTML и JS (jQuery). При редактировании в CKEditor он создает другие теги для ввода пользователем, и когда пользователь отправляет информацию на сервер, в этом ничего не найдено. Итак, я создал <h:inputTextArea value="#{bean.textEditor}"/> , и когда пользователь отправляет, он запускает скрипт, чтобы установить его значение на это <h:inputTextArea/> 🙂

Возвращаясь к вашему вопросу, я бы запустил JS-скрипт для выполнения этого трюка :).Вы можете использовать <h:inputHidden value=#{bean.city}/> onclick событие и на кнопке отправки или что-то в этом роде, чтобы выполнить этот трюк :). Но в этом случае вы должны сами проверить данные, чтобы убедиться, что эта информация верна.