File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
The moose likes JSF and the fly likes Passing arrays from JSF to Javascript Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Java » JSF
Bookmark "Passing arrays from JSF to Javascript " Watch "Passing arrays from JSF to Javascript " New topic

Passing arrays from JSF to Javascript

raunak tuladhar

Joined: Jan 11, 2010
Posts: 2
hello team,

this is my first post here in this forum. i am trying to implement javascript filter in <h:selectManyListbox>. selectmanylistbox takes the arraylist as its value type.

When i try to pass the #{bean.arraylist} from jsf in javascript filter function it reads as object , not the list of string value. how can i pass and convert this arraylist object (#{bean.arraylist}) into javascript array?. searched a lot in this topic but very less documentation in this topic. In jsp it is easy but i find really unfriendly using javascript in jsf. i am nearly close to my filter :P.


the relevant code:

jsf code

<h:inputText value="#{addRelServiceBean.addRelDTO.filtervalue}" id="filter"

javascript src code

function handleKeyUp(input,select,selected,userList,maxNumToShow)
var selectObj, textObj, functionListLength;
var i, searchPattern, numShown,addval;
textObj = $(input);
selectObj = $(select);
functionListLength = userList.length;
if(textObj.value=='Enter name to filter')
searchPattern = "^"+textObj.value;
re = new RegExp(searchPattern,"gi");
selectObj.length = 0;
numShown = 0;
for(i = 0; i < functionListLength; i++)
if(userList[i].search(re) != -1)
selectObj[numShown] = new Option(userList[i],"");
if(numShown == maxNumToShow)
if(selectObj.length == 1)
selectObj.options[0].selected = true;
function addSelectedValue(source,destination){
sourceObj = $(source);
destinationObj = $(destination);
destinationObj[destinationObj.length]=new Option(sourceObj.options[sourceObj.selectedIndex].text,sourceObj.options[sourceObj.selectedIndex].value);

Be nice
Tim Holloway
Saloon Keeper

Joined: Jun 25, 2001
Posts: 17410

Welcome to the JavaRanch, Raunak! "Be Nice" is our specialty. We leave the flaming to other forums!

There's a button in the row of formatting options above the message text area that's labelled "Code". You can use this to enter code and preserve its formatting, which will make your code postings more readable.

Core JSF is all about generating basic HTML, so its JavaScript support is limited to what you can get in raw HTML. Which is mostly just adding script attributes to various form controls and stuff that helps with CSS.

To actually get an array created in JavaScript from core JSF isn't something I know how to do. However, while core JSF doesn't have much support for JavaScript, there are a number of extension tagsets that do JavaScript - and, more importantly AJAX - very well. I've been using the RichFaces tagset for quite a while, and while I haven't been doing client-side array manipulations with it, I's sure it's within the abilities of the RichFaces tags.

JSF is actually a good pairing with AJAX, since a good AJAX-aware tagset can dynamically generate the proper JavaScript for a lot of tasks automatically, tuned to the particular brand and version of browser that each client is using. When taken to their limits, they can even generate non-JSF alternatives for clients who for one reason or other have switched off their browser's JavaScript.

Tag libraries like RichFaces are so powerful that a lot of times one doesn't even need to code any JavaScript at all. Everything that's needed is done by the tags themselves.

An IDE is no substitute for an Intelligent Developer.
raunak tuladhar

Joined: Jan 11, 2010
Posts: 2
hi tim,

thanks for the information about richfaces. now i am using the rich faces tags and the a4j tags also . I am very new to these components of jsf

I solved out my problem that i specified and would like to share here

1. first i stored the required values in javascript array
2. then i initialize the stored javascript array in hiddeninput component by means of javascript "document.getElementById('hidden').value = array
3. then hidden variable was binded in java as string n there i stored string in java array by using the "split function" (which is a cool method to use) and i was done with my problem

but another problem arised and i would like to ask it here again. i would like to tell my requirement first

i have three <h:selectOneListbox>. now i am trying to render
1. the second selectOneListbox from first selectOneListbox and
2. render third selectOneListbox from second selectOneListbox (which is rendered by first selectOneListbox ).

No. 1 works ok for me
When i go for number 2 then it gives the error


The Relevant Code for this

JSF code

java code

i tried it many times but cant fix this problem. please help :S and thanks once again
I agree. Here's the link:
subject: Passing arrays from JSF to Javascript
It's not a secret anymore!