CODEWITHSUNDEEP
javascriptjqueryjsonjsp
harry
harry

Reputation: 731

get value by json array

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

Upvotes: 0

Views: 3060

Answers (3)

Kumar
Kumar

Reputation: 43

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

Upvotes: 0

Kevin
Kevin

Reputation: 1157

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));
}

Upvotes: 0

Diode
Diode

Reputation: 25145

  1. There was a syntax error
  2. 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]));
                }
            });
        });
    });

Upvotes: 2

Related Questions