如何选择选项后的订单表

时间:2017-02-21 09:04:29

标签: javascript jquery

我有URL API,我按“日期”分组。

但是我想知道在从数据重要性中选择选项之后我将如何能够按重要性排序行(并保留日期)。

图片现在如何订购:

http://prntscr.com/ebgodq

我的代码:

    var table = $(".top-table");
    var body = table.children("tbody");
    var regdate = /^(\d{4}\-\d{2}\-\d{2})T(\d{2}:\d{2}:\d{2})$/;

    $.get("http://api.tradingeconomics.com/calendar?c=guest:guest", function (data) {

        showData(data);

    });

    function showData (data) {

        //---Sort the data from the server
        data.sort(function (a, b) {

            return (new Date(a.Date)) - (new Date(b.Date));

        });

        var group = data.reduce(function (before, current) {

            var day = current.Date.replace(regdate, "$1");
            var hour = current.Date.replace(regdate, "$2");

            if (!before[day]) {

                before[day] = [];

            }

            current.Hour = hour;

            before[day].push(current);

            return before;

        }, {});

        for(var date in group) {

            body.append("<tr style='text-align: left;background: #fafafa;line-height: 35px;border-bottom: 2px solid #ff9d00;font-size: 13pt;font-weight: normal;'>" +
                    "<th width='50%'>" + date + "</th>" +
                    "<th width='12%'>Actual</th>" +
                    "<th width='12%'>Previous</th>" +
                    "<th width='12%'>Forecast</th>" +
                    "<th width='4%'></th></tr>");

            group[date].forEach(function(row){

                var rowA = parseInt(row.Actual) > 0 ?
                "<span style='color:red;'>" + noCommas(row.Actual) + "</span>" :
                "<span style='color:green;'>" + noCommas(row.Actual) + "</span>";

                var rowB = parseInt(row.Previous) > 0 ?
                "<span style='color:red;'>" + noCommas(row.Previous) + "</span>" :
                "<span style='color:green;'>" + noCommas(row.Previous) + "</span>";

                var rowC = parseInt(row.Forecast) > 0 ?
                "<span style='color:red;'>" + noCommas(row.Forecast) + "</span>" :
                "<span style='color:green;'>" + noCommas(row.Forecast) + "</span>";

                var Time = hourwithAMPM(row.Date);

                body.append("<tr style='border-bottom: 1px solid #eeeeee;text-align: left;font-size: 12pt;font-weight: 300;line-height: 30px;'>" +
                        "<td><span class='im-" + row.Importance + "'>" + Time + "</span>" +
                        "<span style='margin: 0 10px 0;'><img src='/images/calendar/flags/" + noCommas(row.Country) + ".png' width='16' height='16' /></span>" +
                        "<span style='font-size: 11pt;color:#999999;font-weight: 600;word-spacing: -1px;margin: 0 5px 0;'>" + noCommas(row.Event) + "</span>"+
                        "<span style='color:#333333;'> " + noCommas(row.Reference) + "</span>" +
                        "</td>" +
                        "<td>" + rowA + "</td>" +
                        "<td>" + rowB + "</td>" +
                        "<td>" + rowC + "</td>" +
                        "<td><div class='arrow-down'></div></td>" +
                        "</tr>");

                body.append("<tr  class='showRow' style='display:none;'><td>yay!!!</td></tr>");

            });

        }

    }

0 个答案:

没有答案