How to reload data from Json to table?

royba

Hi,

I have a select menu which filters some data from the table. the problem is - once the table is reloaded - i can't reload the new data to the same table cells.... instead i get a json response like in the picture (1.jpg).

here is my code.....

 script.
        $(document).ready(function () {
            var tableTest = $('#campaigns').dataTable({
                "ajax": {
                    "url": "/Marketing/banner_stats/" + #{campaign_id},
                    "dataSrc": "result"
                },
                "columns": [
                    {"data": "Advertiser"},
                    {"data": "Campaign"},
                    {"data": "Banner"},
                    {"data": "Impressions"},
                    {"data": "Clicks"},
                    {"data": "CTR"}
                ],
                "columnDefs": [
                    {
                        "render": function (data, type, row) {
                            if (data.indexOf("(Deleted)")) {
                                data = data.replace("(Deleted)", "<span class='label label-danger'>Deleted</span>");
                            }
                            return data;
                        },
                        "targets": 0
                    },
                    {
                        "render": function (data, type, row) {
                            if (data.indexOf("(Deleted)")) {
                                data = data.replace("(Deleted)", "<span class='label label-danger'>Deleted</span>");
                            }
                            return data;
                        },
                        "targets": 1
                    },
                    {
                        "render": function (data, type, row) {
                            if (data.indexOf("(Deleted)")) {
                                data = data.replace("(Deleted)", "<span class='label label-danger'>Deleted</span>");
                            }
                            return data;
                        },
                        "targets": 2
                    },
                ]


            });

            $(".selectpicker").on('change', function () {
                var range = $(this).val();
                $(tableTest).load('/Marketing/get_campaigns/false/' + range);
                



            });

        });