binding sql server data to a html Select

I saw this example, it's close to what I need but not exactly.

Binding to a SELECT
http://samples.msdn.microsoft.com/workshop/samples/author/databind/dbselect.htm

Anyone know of a example where I bind either XML or JSON data to a HTML select?

I'm getting the data from sql server and generating an xml or json file and then I want to bind that to an HTML select.
LVL 1
maqskywalkerAsked:
Who is Participating?
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Assume your json looks like
http://jsbin.com/fibohece/1.js
{
    "country": "France"
}

Open in new window

Your html
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<select datasrc="#tdcComposer" datafld="origin">
<option value="Austria">Austria
</option><option value="France">France
</option><option value="Germany">Germany
</option><option value="Italy">Italy
</option><option value="Russia">Russia
</option></select>
 
</body>
</html>

Open in new window

jquery
// Sample data http://jsbin.com/fibohece/1.js
$(function() {
$.getJSON("/fibohece/1.js", function (data) {
    var origin = data.country;
    $("select[datafld='origin']  option").each(function () {
        if ($(this).val() === origin) {
            $(this).prop('selected', true);

        }
    });


});
});

Open in new window

Working sample http://jsbin.com/hikexefa/1/edit using the url for json http://jsbin.com/fibohece/1.js.  If you are accessing a url from a different domain, you have to use jsonp instead of json.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.