get value by json array

Question

I am fetching some data from database and want to show these values in a combo in javascript but combo box is not populating any value, perhaps i am doing something wrong in json or javascript, can anybody tell me where i am wrong? From db 5 values are coming in while loop

JSONObject jsonObj= new JSONObject(); 

List<String> myList = new ArrayList<String>();
while(rs.next()){
t1=rs.getString(1);
myList.add(t1);
 jsonObj.put("name",myList.toArray());
}
response.setContentType("application/json");
response.getWriter().write(jsonObj.toString());

want to get above values in javascript

<script type="text/javascript">
  $(document).ready(function() {
$("#combo").change(function() {
$.getJSON('combo.jsp', {count : this.value}, function(responseData) {
$("#combo1").empty().append ("<option>please select</option>");
var json = $.parseJSON(responseData);
var myValues = json.name;
for (var idx in myValues) {
$("#combo1").append(
    $("<option></option>").html(myValues[idx]).val(myValues[idx])
);
}
});
});          
    </script>

Please anybody give me some idea at least, i am not able to find any solution

put some debugging statements in your code and you'll probably locate the problem. alert() in js and System.err.println() in Java. — jcomeau_ictx, Feb 13 '12 at 06:08
@jcomeau_ictx i am getting value in server side but i do not know whether jsonObj is keeping values correctly or not? have a look at this: http://stackoverflow.com/questions/9248383/retrieve-more-than-one-value-by-json-array-objects — harry, Feb 13 '12 at 06:11
use firebug to see the returned json object from your ajax call. when you get that, paste into your question to clarify. — dbrin, Feb 13 '12 at 06:38
@DmitryB thanks but can you give me any idea to this question where i have elaborated : [please see here](http://stackoverflow.com/questions/9248383/retrieve-more-than-one-value-by-json-array-objects) — harry, Feb 13 '12 at 06:41

Diode · Accepted Answer · 2012-02-13T09:19:25.157

There was a syntax error
parseJSON is not needed when data is retrieved using getJSON

Assuming the response json is of struture: {name={prop1:value1 , prop2: valu2, prop3:value3 ..... }}

    $(document).ready(function () {
        $("#combo").change(function () {
            $.getJSON('combo.jsp', {
                count: this.value
            }, function (responseData) {
                $("#combo1").empty().append("<option>please select</option>");
                var myValues = responseData.name;
                for (var idx in myValues) {
                    $("#combo1").append(
                    $("<option></option>").html(myValues[idx]).val(myValues[idx]));
                }
            });
        });
    });

Or if the structure is: {name=[value1 , valu2, value3, ..... ]}

    $(document).ready(function () {
        $("#combo").change(function () {
            $.getJSON('combo.jsp', {
                count: this.value
            }, function (responseData) {
                $("#combo1").empty().append("<option>please select</option>");
                var myValues = responseData.name;
                for (var i=0; i < myValues.length; i++) {
                    $("#combo1").append(
                    $("<option></option>").html(myValues[i]).val(myValues[i]));
                }
            });
        });
    });

thanks a lot Diode, it worked like a charm. I just need one more help, that is how to send to a servlet by onchange event like i am sending it to combo.jsp? — harry, Feb 13 '12 at 08:00

score 0 · Answer 2 · edited Feb 13 '12 at 11:00

0

I don't know which browser you are using. But afaik, insert html directly by using innerHTML is not working on some browser. You should try this way:

$("#combo1")[0].options.add(new Option(label, value));

label indicates the string inner "option" value indicates the attribute "value" of the "option"

In your code:

for (var i = 0, val; val = myValues[i]; i++)
{
    $("#combo1")[0].options.add(new Option(val, val));
}

edited Feb 13 '12 at 11:00

eeerahul

1,629
4
27
38

answered Feb 13 '12 at 06:35

Kevin

1,147
11
21

thanks kelvin but where to add this code? can you please clarify little bit – harry Feb 13 '12 at 06:42
$("#combo1").append( $("").html(myValues[idx]).val(myValues[idx]) ); – Kevin Feb 13 '12 at 06:48
thanks kelvin for your suggestion but it is not working have you tested in my friend? – harry Feb 13 '12 at 06:57
it is showing javascript error, if possible can you please edit my javascript code and add your modified code so that everybody can see it – harry Feb 13 '12 at 07:08
no friend it is not populating value in combobox, i think some error is there in server side JSON – harry Feb 13 '12 at 07:17

score 0 · Answer 3 · edited Feb 13 '12 at 13:01

0

I doubt u are getting values from your getJSON CALL .. Use Firebug to see if you are getting response for your ajax call. And use console.log(responseData); inside $.getJSON('combo.jsp', {count : this.value}, function(responseData) {

console.log(responseData); });

Hi try this:

var options = '';
$.getJSON('combo.jsp', {
    count: this.value
}, function (responseData) {
    $.map(responseData, function (item) {
        console.log(item);
        //alert(item.code);
        options += '<option value="' + item.code + '">' + item.description + '</option>';
    });
}
);
$("#combo").html(options);

edited Feb 13 '12 at 13:01

Toto

89,455
62
89
125

answered Feb 13 '12 at 07:20

Kumar

43
1
8

ok i am trying in firebug but if possible provide a solution to this above problem by editing my json or javascript code – harry Feb 13 '12 at 07:33
var options = ''; $.getJSON('combo.jsp', { count: this.value }, function (responseData) { console.log(responseData); $.map(responseData, function (item) { //alert(item.code); options += ''; }); } ); $("#combo").html(options); – Kumar Feb 13 '12 at 07:56
yeah thanks for your suggestion well above answer worked for me :) – harry Feb 13 '12 at 08:11

get value by json array

3 Answers3