CODEWITHSUNDEEP
jsfjsf-2
Valter Silva
Valter Silva

Reputation: 16656

How populate a select tag in HTML to JSF 2?

I have this code which works fine in HTML as you can see, but how get the values of the <select /> tag to insert in my bean ?

Something like this:

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

I'm trying a lot of things but nothing so far. Any idea ?

Upvotes: 1

Views: 1094

Answers (4)

BachT
BachT

Reputation: 1068

I have an stupid (or funny) idea when i integrate CKEditor into JSF (take a look, it is wonderful).

Thus, CKEditor does not support JSF fully, but it supports HTML and JS (jQuery) themselves. When editing in CKEditor, it create other tags for user to input on it, and when user submit information to server, nothing found in that. So I created a <h:inputTextArea value="#{bean.textEditor}"/> and when user submit, it run a script to set its value to that <h:inputTextArea/> :)

Back to your question, i would fire a JS script to do that trick :).You can use <h:inputHidden value=#{bean.city}/> and onclick event on submit button or something like that to do that trick :). But in this case, you have to validate data yourself to make sure that this information is vaild.

Upvotes: 0

BalusC
BalusC

Reputation: 1108632

This isn't going to work. JSF needs to know about all of the dropdown items.

Either use a plain HTML <select> element instead of <h:selectOneMenu> and grab the submitted value by @ManagedProperty or <f:viewParam>, or port that JS code to JSF backing bean code so that you can use <f:selectItems>. You can use <f:ajax> to fill and render the 2nd dropdown.

Upvotes: 2

Bhesh Gurung
Bhesh Gurung

Reputation: 51030

The Javascript functions seem to take the ids of the selects.

If you do <h:form prependId="false"> and <h:selectOneMenu id="city" then "city" will be the id of the select rendered by JSF. Just pass that ids to the functions.

<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>

Upvotes: 1

Piotr Sobczyk
Piotr Sobczyk

Reputation: 6583

You need to use <h:selectItems> tag. A nice introduction is here and here .

Upvotes: 0

Related Questions