Charger les Données JSON à l'Aide de jQuery AJAX

J'ai besoin d'imprimer ces informations lorsque vous cliquez sur un bouton et le tri si par date, pour l'instant j'ai ceci: j'ai du fichier json qui ressemble à ça, mais je n'ai pas été capable de l'imprimer sur la page et je n'ai toujours pas eu le tri par date dans la partie. Je ne suis pas sûr si le problème est le lien à l'ajax version que je suis en utilisant ou quel est le problème, parce que j'ai vu un exemple qui ressemble exactement à cela sur youtube et il fonctionne très bien.

JSON:

  [
{
    "users": [
        {
            "name": "user1",
            "Endorsement": "some comment",
            "date": "8/11/2012"
        },
        {
            "name": "user2",
            "Endorsement": "some comment2",
            "date": "9/27/11"
        },
        {
            "name": "user3",
            "Endorsement": "some comment3"
        },
        {
            "name": "user4",
            "Endorsement": "some comment4",
            "date": "4/2/13"
        },
        {
            "name": "user5",
            "Endorsement": "some comment5"
        },
        {
            "name": "user6",
            "Endorsement": "some comment6",
            "date": "3/17/13"
        },
        {
            "name": "user7",
            "Endorsement": "some comment7",
            "date": "5/22/13"
        },
        {
            "name": "user8",
            "Endorsement": "some comment8",
            "date": "9/27/13"
        }
    ]
}

]

HTML mise à jour:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Contact</title>
    <link rel="shortcut icon" href="stridesFavicon.ico">
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-responsive.css">
    <link rel="shortcut icon" href='http://sites.google.com/site/lowcoupling/favicon_16x16.ico' />

</head>
<body>
    <!--Body content-->

  <div id='Div1'>


    <a href="#" id="clickme">Get JSON Data</a>


    </div>


    <script type="text/javascript"     src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>



    <script type="text/javascript" src="js/bootstrap.js"></script>
    <script src="myscript.js" type="text/javascript" /></script>
    <script type="text/javascript">

        $(document).ready(function () {
            $('.dropdown-toggle').dropdown();
        });  
    </script>
</body>
</html>

JS mise à jour:

$("#clickme").cliquez sur(function () {

$.getJSON("users.json", function (data) {

    var items = [];
    $.each(data, function (key, dvalue) {


        $.each(dvalue, function (key, value) {
            items.push('<li id="' + key + '">' + value + '</li>');

        });
    });

    $('<ul/>', {
        'class': 'interest-list',
        html: items.join('')

    }).appendTo('body');

});

});

Mais ne fonctionne pas. le sens n'est pas le chargement des noms d'utilisateur; c'est plutôt l'impression de quelque chose comme ça à chaque fois que je clique sur le lien:

•[object object],[object object],[object object],[object object],[object object],[object object],[object object],[object object]

print( uneval(json) );
<script src="myscript.js" type="text/javascript" /> besoin d'une balise de fermeture, les balises de script ne peut pas être à fermeture automatique.
Aussi, il n'y a pas ul sur votre page pour la li pour être annexé à la.
Vérifiez également le navigateur de la console pour trouver l'erreur.
Assurez-vous également que vous mettez ce code à l'intérieur de document.ready événement.

InformationsquelleAutor Albert Viglieri | 2013-10-01

jason manque un peu de virgules, chaque ligne à l'intérieur de l'json doit se terminer par une virgule, sauf s'il est le dernier enfant de la portée, ce qui en fait:

[
    {
        "users": [
            {
                "name": "user1",
                "Endorsement": "some comment",
                "date": "8/11/2012"
            },
            {
                "name": "user2",
                "Endorsement": "some comment2",
                "date": "9/27/11"
            },
            {
                "name": "user3",
                "Endorsement": "some comment3"
            },
            {
                "name": "user4",
                "Endorsement": "some comment4",
                "date": "4/2/13"
            },
            {
                "name": "user5",
                "Endorsement": "some comment5"
            },
            {
                "name": "user6",
                "Endorsement": "some comment6",
                "date": "3/17/13"
            },
            {
                "name": "user7",
                "Endorsement": "some comment7",
                "date": "5/22/13"
            },
            {
                "name": "user8",
                "Endorsement": "some comment8",
                "date": "9/27/3"
            }
        ]
    }
]

InformationsquelleAutor Labib Ismaiel

2

essayer !
```
$("button").click(function () {

$.getJSON("users.json", function (obj) {


    $.each(obj.users, function (key, value) {
        $("ul").append("<li>" + value.name + "</li>");

    });

});
```
});

et si il y a une erreur alors utiliser la console de débogage dans le navigateur.
et soit faire un violon ou d'écrire ce qui est de l'erreur. et il n'y a aucun élément ul dans votre code html.
- merci, j'ai ajouté la balise ul, mais toujours pas de chargement de rien; il ne montrent aucune erreur non plus.
- mise à jour d'écriture html en question plz
- J'ai corrigé le jason et lors de l'exécution de nouveau j'ai eu ce message SCRIPT5007: Impossible d'obtenir la propriété de la longueur de pas défini ou référence null jquery.min.js ligne 4 caractères 5189
InformationsquelleAutor developerCK
0

Le json n'est pas valide. J'ai validé à l'aide de http://jsonlint.com/ et il dit erreur à la ligne 6. Vous avez laissé une virgule en dessous de la partie:
```
"Endorsement": "some comment"  
               "date":"8/11/2012"
```
C'est la première approbation-date de paire

InformationsquelleAutor Rajesh

$("button").click(function () {

$.getJSON("users.json", function (data) {



for (i in data)
{

for (k in data[i]) {
               alert(data[i][k]);
            }


});

});

vous pouvez ajouter une brève explication sur le code pour mieux comprendre...

InformationsquelleAutor Niaz Morshed

$.ajax({
    type:'POST',
   url:'Default.aspx/GetPro',
  data:"{Pid:'"+ faram+"'}",
 contentType: 'application/json; charset=utf-8',
  dataType: 'json',
 async: true,
cache: false,

success: function(msg) {
 alert("{Pid:'"+ faram+"'}");
var orders =msg;
 if (orders.length > 0) {
test(orders);
   }
 else {
  alert("No Record Found");
   }
 },
error: function(xhr, textStatus, errorThrown) {
            alert(xhr.status);
              alert(errorThrown);
              alert(xhr.responseText);
        }

});

function test(data)
{

for (i in data)
          {
//ProductName Is Property Field Of c# Object
 alert(data[i]['ProductName'])
}



 }

InformationsquelleAutor Niaz Morshed

Vous devez vous connecter pour publier un commentaire.