ansaurus

Question

How to populate a dropdownlist with json data in jquery?

Answer 1

+2 A:

var listItems= "";
var jsonData = jsonObj.d;
    for (var i = 0; i < jsonData.Table.length; i++){
      listItems+= "<option value='" + jsonData.Table[i].stateid + "'>" + jsonData.Table[i].statename + "</option>";
    }
    $("#<%=DLState.ClientID%>").html(listItems);

Example

   <html>
    <head></head>
    <body>
      <select id="DLState">
      </select>
    </body>
    </html>

    /*javascript*/
    var jsonList = {"Table" : [{"stateid" : "2","statename" : "Tamilnadu"},
                {"stateid" : "3","statename" : "Karnataka"},
                {"stateid" : "4","statename" : "Andaman and Nicobar"},
                 {"stateid" : "5","statename" : "Andhra Pradesh"},
                 {"stateid" : "6","statename" : "Arunachal Pradesh"}]}

    $(document).ready(function(){
      var listItems= "";
      for (var i = 0; i < jsonList.Table.length; i++){
        listItems+= "<option value='" + jsonList.Table[i].stateid + "'>" + jsonList.Table[i].statename + "</option>";
      }
      $("#DLState").html(listItems);
    });

Jon 2010-04-14 13:35:59

@jon jsonObj.Table is undefined? Why i get this?

Pandiya Chendur 2010-04-14 13:47:16

@Pandiya Chendur, I'm not sure, let me post a working example and maybe that will help. Try jsonObj.d.Table

Jon 2010-04-14 13:48:59

@jon ok thanks for your answer...

Pandiya Chendur 2010-04-14 13:50:20

@jon link seems to be broken it doesn't load..

Pandiya Chendur 2010-04-14 13:53:11

@Pandiya Chendur, no problem. The example is up, you might want to try replacing jsonObj.Table with jsonObj.d.Table since that is what you are using to generate the jsonObject that is alerted in the code you posted.

Jon 2010-04-14 13:53:22

@jon edit your answer to make it comfortable...

Pandiya Chendur 2010-04-14 13:54:37

@Pandiya Chendur, No problem, I will update my answer, also I re-posted the example link

Jon 2010-04-14 13:55:39

@jon still i get the error `jsonObj.d.Table` is undefined... And some prob with your link i cant see a working example...

Pandiya Chendur 2010-04-14 13:59:51

@Pandiya Chendur, I updated my answer again. I don't know if that will help or why the example link won't work. I'll just post my example code in my answer.

Jon 2010-04-14 14:11:35

@jon see my edited question part... You ll get a fair idea how i receive the data..

Pandiya Chendur 2010-04-14 14:17:23

@jon i found the error `$("#<%=DLState.ClientID%>").html(listItems);` since i use asp.net masterpage my id will be different..

Pandiya Chendur 2010-04-14 14:22:55

Shouldn't you do a JSON.parse (or eval though not recommended) to get a Javascript object? e.g. var jsonData = JSON.parse(jsonObj.d);I use Douglas Crockfords JSON parser (http://www.json.org/json2.js)

Daniel Lee 2010-04-14 14:26:32

@Daniel `$("#<%=DLState.ClientID%>")` this seems to be my error..

Pandiya Chendur 2010-04-14 14:27:20

@Pandiya Chendur, were you able to determine what was wrong with that line?

Jon 2010-04-14 15:02:59

ansaurus

tags:

views:

answers:

How to populate a dropdownlist with json data in jquery?

related questions