Binding java.util.List with drop-down using Javascript

Question

I need to bind a java.util.List<String> to a HTML drop-down javascript.

I am able to get the java.util.List in the below format:

[Name1,Name2,Name3]

For binding I will use this code (it works fine):

var opt = document.createElement("OPTION");                 
opt.text = xhr.responseText;
opt.value = xhr.responseText;
document.getElementById("slctFullName").options.add(opt);

But I don't know the easiest approach to iterate through these elements.

Please let me know how to iterate through the elements :(

Thanks,

What technologies are you using? JSP, Freemarker? If you're passing data directly into the stream consider JSON. — Boris the Spider
– Boris the Spider, Commented Feb 16, 2013 at 13:32
yes. JSP, servlet and javascript. For sending the request in servlet, I use xmlHttpRequest. In servlet, I am creating the list and sending the list using: resp.getWriter().print(nameList); I am able to retrieve the list in the format I mentioned in the above post, but not able to iterate through it properly. Please let me know if you want me to post some more of the code. — WhoAmI
– WhoAmI, Commented Feb 16, 2013 at 13:37
You need to send valid JSON over the wire, so something like ["Name1", "Name2", "Name3] (notice the quotes), you can then parse then JSON and you have a javascript array. — Boris the Spider
– Boris the Spider, Commented Feb 16, 2013 at 13:49
Ok, I did a quick change to get the same in JSON like: {"Name1":"Name1","Name2":"Name2","Name3":"Name3"}. I am able to get this in javascript. Now tell how to bind this JSON with the drop-down in javascript. I used Gson in java servlet to generate this JSon. Thanks, — WhoAmI
– WhoAmI, Commented Feb 16, 2013 at 13:52
So, now you need to parse that to a javascript object as per the link and then loop over it as in here and build your options... — Boris the Spider
– Boris the Spider, Commented Feb 16, 2013 at 14:12

Community · Accepted Answer · 2017-05-23 11:56:24Z

1

You first need to get the List into a javascript-friendly format, I would suggest:

["Name1", "Name2", "Name3"]

This represents a javascript array in JSON, now you should be able to assign what to a javascript object by parsing it

var arr = JSON.parse(xhr.responseText);

Now you can loop over it like a normal array:

for (var i=0; i<arr.length; ++i) {
 var opt = document.createElement("OPTION");                 
 opt.text = arr[i];
 opt.value = arr[i];
 document.getElementById("slctFullName").options.add(opt); 
}

Note the compatability caveats in here.

edited May 23, 2017 at 11:56

CommunityBot

11 silver badge

answered Feb 16, 2013 at 14:18

Boris the Spider

61.4k6 gold badges111 silver badges177 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

WhoAmI Over a year ago

var arr = JSON.parse(xhr.responseText); is not working in IE. Getting a javascript error: JSON is undefined. Please let me know how to make this work in IE :(

Boris the Spider Over a year ago

Check the link. You can use eval but it's not too safe...

Collectives™ on Stack Overflow

Binding java.util.List with drop-down using Javascript

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related