迭代并从JSON获取某些索引的唯一值

时间:2017-01-04 15:35:53

标签: javascript php jquery mysql json

我使用如下查询从PHP获取数据:

SELECT objective,signal_type,signal_name FROM signals WHERE channel="Email"

数据回传如下:

[
    {
        "objective": "Awareness",
        "signal_type": "Efficiency",
        "signal_name": "CPM"
    },
    {
        "objective": "Awareness",
        "signal_type": "Quality",
        "signal_name": "Click-thru Rate"
    },
    {
        "objective": "Awareness",
        "signal_type": "Quality",
        "signal_name": "Frequency"
    },
    {
        "objective": "Awareness",
        "signal_type": "Quality",
        "signal_name": "Interaction Rate"
    },
    {
        "objective": "Awareness",
        "signal_type": "Quality",
        "signal_name": "Viewability"
    },
    {
        "objective": "Awareness",
        "signal_type": "Volume",
        "signal_name": "Display Time"
    },
    {
        "objective": "Awareness",
        "signal_type": "Volume",
        "signal_name": "Impression"
    },
    {
        "objective": "Awareness",
        "signal_type": "Volume",
        "signal_name": "Reach"
    },
    {
        "objective": "Conversion",
        "signal_type": "Efficiency",
        "signal_name": "Cost per Action"
    },
    {
        "objective": "Conversion",
        "signal_type": "Efficiency",
        "signal_name": "ROI/ROAS"
    },
    {
        "objective": "Conversion",
        "signal_type": "Quality",
        "signal_name": "Avg Order Value"
    },
    {
        "objective": "Conversion",
        "signal_type": "Volume",
        "signal_name": "Conversion"
    },
    {
        "objective": "Conversion",
        "signal_type": "Volume",
        "signal_name": "Revenue"
    },
    {
        "objective": "Engagement",
        "signal_type": "Efficiency",
        "signal_name": "Cost per Click"
    },
    {
        "objective": "Engagement",
        "signal_type": "Quality",
        "signal_name": "Avg Interaction Time"
    },
    {
        "objective": "Engagement",
        "signal_type": "Quality",
        "signal_name": "Conversion Rate"
    },
    {
        "objective": "Engagement",
        "signal_type": "Volume",
        "signal_name": "Click"
    },
    {
        "objective": "Engagement",
        "signal_type": "Volume",
        "signal_name": "Interaction"
    },
    {
        "objective": "Engagement",
        "signal_type": "Volume",
        "signal_name": "Interaction Time"
    }
]

我可以将这一切附加到这样的表格中:

$.each(data, function(index, key) {
 $('#myTable').append('<tr><td>'+key.objective+'</td><td>'+key.signal_type+'</td><td>'+key.signal_name+'</td></tr>');
                });

这会产生一个完美准确的表格,但不是令人赏心悦目的表格。我得到这样的东西:

| Signal Type | Signal Types | Available Signals    |
|-------------|--------------|----------------------|
| Awareness   | Efficiency   | CPM                  |
| Awareness   | Quality      | Click-thru Rate      |
| Awareness   | Quality      | Frequency            |
| Awareness   | Quality      | Interaction Rate     |
| Awareness   | Quality      | Viewability          |
| Awareness   | Volume       | Display Time         |
| Awareness   | Volume       | Impression           |
| Awareness   | Volume       | Reach                |
| Conversion  | Efficiency   | Cost per Action      |
| Conversion  | Efficiency   | ROI/ROAS             |
| Conversion  | Quality      | Avg Order Value      |
| Conversion  | Volume       | Conversion           |
| Conversion  | Volume       | Revenue              |
| Engagement  | Efficiency   | Cost per Click       |
| Engagement  | Quality      | Avg Interaction Time |
| Engagement  | Quality      | Conversion Rate      |
| Engagement  | Volume       | Click                |
| Engagement  | Volume       | Interaction          |
| Engagement  | Volume       | Interaction Time     |

(请注意,标题是&#34;硬编码&#34;在我的HTML中)

我最理想的是:

| Signal Type | Signal Types | Available Signals    |
|-------------|--------------|----------------------|
| Awareness   | Efficiency   | CPM                  |
|             | Quality      | Click-thru Rate      |
|             |              | Frequency            |
|             |              | Interaction Rate     |
|             |              | Viewability          |
|             | Volume       | Display Time         |
|             |              | Impression           |
|             |              | Reach                |
| Conversion  | Efficiency   | Cost per Action      |
|             |              | ROI/ROAS             |
|             | Quality      | Avg Order Value      |
|             | Volume       | Conversion           |
|             |              | Revenue              |
| Engagement  | Efficiency   | Cost per Click       |
|             | Quality      | Avg Interaction Time |
|             |              | Conversion Rate      |
|             | Volume       | Click                |
|             |              | Interaction          |
|             |              | Interaction Time     |

这里的区别在于,根据之前的列,列中有不同的值。有关如何获得此输出的任何想法?请注意,我可以调整我的SQL查询或我的javascript / jquery(或两者),具体取决于最有效的方法。

1 个答案:

答案 0 :(得分:1)

检查之前是否使用过该值。如果是,则打印空白字符串,如果不打印新值。

这会转换为您的附加代码:

storedObjective = "";
storedSignal_type = "";
$.each(data, function(index, key) {

    if (key.objective == storedObjective)
    {
        print_1 = "";
    }
    else
    {
        print_1 = objective;
        storedObjective = key.objective;
    }
    if (key.signal_type == storedSignal_type)
    {
        print_2 = "";
    }
    else
    {
        print_2 = key.signal_type;
        storedSignal_type = key.signal_type;
    } 

  $('#myTable').append('<tr><td>'+print_1+'</td><td>'+print_2+'</td><td>'+key.signal_name+'</td></tr>');
});