How to parse JSON data with jQuery / JavaScript? Tamil Programmers

#behindthecode

STEP 1

<div id="id01"></div>

STEP 2
<script>
function myFunction(arr) {
    var out = "";
    var i;
    for(i = 0; i<arr.length; i++) {
        out += '<a href="' + arr[i].url + '">' + 
        arr[i].display + '</a><br>';
    }
    document.getElementById("id01").innerHTML = out;
}
</script>


STEP 3
<script> 
myFunction([
{
"display": "HTML Tutorial",
"url": "http://tamilprogrammers.blogspot.com"
},
{
"display": "CSS Tutorial",
"url": "http://tamilprogrammers.blogspot.com"
},
{
"display": "JavaScript Tutorial",
"url": "http://tamilprogrammers.blogspot.com"
},
{
"display": "SQL Tutorial",
"url": "http://tamilprogrammers.blogspot.com"
},
{
"display": "PHP Tutorial",
"url": "http://tamilprogrammers.blogspot.com"
},
{
"display": "XML Tutorial",
"url": "http://tamilprogrammers.blogspot.com"
}
])
</script> 


SAMPLE HTML :

<!DOCTYPE html>
<html>
<body>
<div id="id01"></div>
</body>
</html>
<script>
function myFunction(arr) 
{
    var out;
    var print = '<select>';
    var i;
    for(i = 0; i<arr.length; i++) 
    {
        out = String(arr[i].VB);         
        var test = out.split(',');
        for(var j=0;j<test.length;j++)
        {
        print += '<option value="">'+test[j]+'</option>';
    }    
    }
    print += '</select>';
    $("#id01").html(print);
}
myFunction([{"VB": ["put", "kannan", "run"], "PRP": [], "RP": [], "CD": ["16/5/18", "1.add", "2.chat", "3.rectent", "4.vslogo", "5.you", "6.include", "7.full", "8.UI"], "TO": ["to"], "VBD": ["worked", "displayed", "attached"], "VBN": [], "NNS": ["designs", "changes", "images", "fonts", "tweets", "corrections"], "VBZ": [], "VBP": [], "NN": ["today", "i", "ip", "address", "line", "bot", "background", "change", "order", "way", "include", "chatbot", "icon", "header", "chatbot", "work", "correction", "chatbot", "process", "nltk", "processor", "code", "testing", "process", "i", "file"], "CC": ["and", "and"], "PRP$": [], "VBG": [], "POS": [], "WDT": [], "MD": [], "DT": ["the", "the"], "JJR": [], "WP": [], "NNP": ["Testing"], "RB": ["successfully"], "EX": [], "IN": ["in", "in", "in", "with", "inside", "below"], "JJ": ["single", "tab", "give", "i", "clear"], "PDT": ["all"]}]);
</script>


EXAMPLE 2


<!DOCTYPE html>
<html>
<body>
<div id="put"></div>
<div id="value"></div>
</body>
</html>
<script>
var d = {"VB": ["put", "kannan", "run"], "PRP": [], "RP": [], "CD": ["16/5/18", "1.add", "2.chat", "3.rectent", "4.vslogo", "5.you", "6.include", "7.full", "8.UI"], "TO": ["to"], "VBD": ["worked", "displayed", "attached"], "VBN": [], "NNS": ["designs", "changes", "images", "fonts", "tweets", "corrections"], "VBZ": [], "VBP": [], "NN": ["today", "i", "ip", "address", "line", "bot", "background", "change", "order", "way", "include", "chatbot", "icon", "header", "chatbot", "work", "correction", "chatbot", "process", "nltk", "processor", "code", "testing", "process", "i", "file"], "CC": ["and", "and"], "PRP$": [], "VBG": [], "POS": [], "WDT": [], "MD": [], "DT": ["the", "the"], "JJR": [], "WP": [], "NNP": ["Testing"], "RB": ["successfully"], "EX": [], "IN": ["in", "in", "in", "with", "inside", "below"], "JJ": ["single", "tab", "give", "i", "clear"], "PDT": ["all"]};

var print = '<select id="txtSelect">';
$.each( d, function( key1, value1 ) {
print += '<option value="'+ value1 +'" >' + key1 + '</option>';
    //$('#put').append( $('<div></div>').html(key1) );
});
print += '</select>';
$('#put').html(print);

$('#txtSelect').change(function(){
  $("#value").html($(this).val());
});

</script>


by
Tamil Programmers


கருத்துகள்