asp.net json displaying weird results

Question

I am having trouble displaying results recieved from asp.net WebMethod. I have a HTML template and fill in the results from JSON response. The problem is that the first response is being displayed once, the second is displayed 2 times, the third 4 times, the fourth 8 times and so on . Here is the jQuery (I need to reference "d" first because the response is comming from asp.net and they put it there automatically)

     function fnGetContent(keyword) {
            var NewKeyword = keyword.tag;
            var type = keyword.type
            var oldresults = $("#fillresultsdiv").html()
            $('#hidQueryType').val('tagsearch');
            $.ajax({
                type: "POST",  //GetEvents(iType As Integer, sSearch As String)
                url: "Default.aspx/GetEvents",
                data: "{'iType':'" + type + "','sSearch' : '" + NewKeyword + "' }",
                contentType: "application/json; charset=utf-8",
                dataType: "json",

                success: function (msg) {
                    var events = [];
                    var obj = $.parseJSON(msg.d);

                    $.each(obj.res, function() {
                        var newRow = $('.Template').clone();

                        // Now loop through the object
                        for (var prop in this) {
                            if (this.hasOwnProperty(prop)) {

                                // Lucky for you, the keys match the classes :)
                                $('.' + prop, newRow).text(this[prop]);
                            }
                        }
                        $('#fillresultsdiv').append(newRow);
                    });

There is only one entry in the JSON for each event, it is the jQuery code that is making this happen, sample response:

 {"d":"{\"res\":[{\"day\":\"26\",\"dayofweek\":\"Tue\",\"month\":\"Jun\",\"title\":\"Glen Hansard\"
       ,\"venue\":\"Vic Theatre\",\"time\":\"7:00 PM\",\"ticketurl\":
        \"http://seatgeek.com/glen-hansard-tickets/chicago-illinois....

Seth Flowers · Accepted Answer · 2012-06-26 19:29:25Z

3

Each time you call

var newRow = $('.Template').clone();

You are creating a copy of all the elements that have the "Template" class. You are then appending all these copies to your element with id "fillresultsdiv". Each one of these copies also has this "Template" class applied to it, so the next time you clone, you are picking up the previously cloned copies.

The first time you call it there is only one row, the second time 2, then 4, then 8, etc.

You can probably just change the cloning line to

var newRow = $('.Template').clone().removeClass("Template");

answered Jun 26, 2012 at 19:29

Seth Flowers

9,2302 gold badges34 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Scott Selby Over a year ago

nice , how are you the only one that got that? I tried asking in chat too -

Scott Selby Over a year ago

var newRow = $('.Template').clone().removeClass('Template')

Collectives™ on Stack Overflow

asp.net json displaying weird results

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related