在AJAX循环中创建div

Question

I am getting data from the server side using AJAX, I am now trying to populate data from from a list of objects into divs, the problem I am having is that I can not create the div while inside of the foreach loop.

    $(document).ready(function () {

        var divs = "";

        var url = "../Graphs/CreateChart";


        $.ajax({
            type: 'POST',
            url: url,
            success: function (data) {
                for (var i in data) {

                    var x = data[i];

                    for (var j in x) {
                        var val;
                        if (x.hasOwnProperty(j)) {

                            val = x[j].SpName;

                            if (x[j].SpName != "undefined") {
                                $('#a').appendTo('#content');
                                createBarChart("#a", "USP_Charts_BarChart1"); 
                            }
                        }
                    }
                }
            }, dataType: "json",
            cache: false
        });
    });
</script>

I am trying to populate where it says "#a" with val and also then I need to populate the div I write with the val for the id, but when I try to put the document.write inside of the loop, I get a blank screen, any ideas why it would do this?

Answer 1

you're trying to append a created variable to your content? Try making the markup a string FIRST then appending it.

To test it try it without data.

$("<h2>HI</h2>").appendTo("#content");

If that works, then make a string that is the markup you want, with the data you need.

$("<a data='"+data.variable+"'></a>").appendTo("#content");

append and appendTo are VERY similar, but you need to use a string, not just an identifier, if the object doesn't exist yet.