好的,所以我试图找出为什么同样的两件不起作用。一个在我的when / done语句之外工作,但是我需要工作的是在/完成时。有人可以看看,告诉我我做错了什么。能够让3个请求中的2个工作得很好。
jQuery(function() {
var ConvExtID = 'jdv_electric';
var ConvAPIKey = '369281456857b6910b0b8e0b1d7b046c';
var ConvAPISec= '%241%24SVUTmT1e%24hqQHTUvAFOoUuZ5bFVqle.';
var NewConvData ='https://api.logmycalls.com/services/getCallDetails?criteria[external_ouid]='+ConvExtID+'&criteria[start_calldate]=2015-12-01&criteria[end_calldate]=2015-12-31&api_key='+ConvAPIKey+'&api_secret='+ConvAPISec+'&sort_by=id&sort_order=asc';
var goaltotal = 'https://aspentouch.com/wp-content/plugins/CSAnalytics/lib/data/data-GoalValueTotals.php';
var WeatherAPI = 'https://api.worldweatheronline.com/premium/v1/past-weather.ashx?q=27560&format=json&date=2015-12-01&enddate=2015-12-31&tp=24&key=5553de26af2e2c672d1042c05800d'
//Creates Table for Weather Data
var channelHTML = ''
var DispositionAnswered = '';
var DispositionNoAnswer = '';
var TotalCallMin = 0;
var TotalCount = '';
var AvgCallDuration = '';
var ValueCallsSingle = '';
var ValueCalls = '';
var ValueCallMinutes = 0;
jQuery.when(
jQuery.getJSON(WeatherAPI),
jQuery.getJSON(goaltotal),
jQuery.getJSON(NewConvData)
).done (function (data, data2, data3) {
var data = data[0].data;
console.log(data, data2, data3);
var weatherHTML = '';
var lookup = {};
var weather = data.weather;
for (var i = 0; i < weather.length; ++i) {
var key = weather[i].date.replace(/-/g,'');
lookup[key] = i;
weatherHTML += '<li id="day'+[i]+'" class="day day-container"><div class="date">' + weather[i].date + '</div><div class="svg-icon"><img src="' + weather[i].hourly[0].weatherIconUrl[0].value + '" /></div><div class="data-wrap col2"><p class="data hi-temp"><span>' + weather[i].maxtempF + '</span><sup class="deg ng-scope" data-ng-if="hasValue()">°</sup></p><p class="data lo-temp"><span>' + weather[i].mintempF + '</span><sup class="deg ng-scope" data-ng-if="hasValue()">°</sup></p></div><p class="data desc">' + weather[i].hourly[0].weatherDesc[0].value + '</p></li>';
}
jQuery('#weather_report').append(weatherHTML);
jQuery.each(data2[0], function (i, item) {
var day = jQuery("#day" + lookup[item.date]);
day.append('<div class="content"><div class="content-conv-rate"><span class="goal-content">Goal Conversion Rate: </span><span class="goal-value">' + (+item.goalConversionRateAll).toFixed(2) + '%</span></div><div class="content-comp"><span class="goal-content">Goal Completions: </span><span class="goal-value">' + item.goalCompletionsAll + '</span></div><div class="content-value"><span class="goal-content">Goal Value:</span> <span class="goal-value">$' + item.goalvalueall + '</span></div></div>');
})
//I cant get this one to work
jQuery.each(data3.results, function(i, value) {
channelHTML += '<tr><td class="tg-yw4l">' + data3.results[i].calldate + '</td><td class="tg-yw4l">' + data3.results[i].tracking_number + '</td><td class="tg-yw4l">' + data3.results[i].disposition + '</td><td class="tg-yw4l">' + data3.results[i].duration + '</td><td class="tg-yw4l">' + data3.results[i].id + '</td><td class="tg-yw4l">' + data3.results[i].is_outbound + '</td><td class="tg-yw4l">' + data3.results[i].ouid + '</td><td class="tg-yw4l">' + data3.results[i].repeat_call + '</td><td class="tg-yw4l">' + data3.results[i].caller_id + '</td><td class="tg-yw4l">' + data3.results[i].ringto_number + '</td><td class="tg-yw4l"><audio src="' + data3.results[i].file_url + '" controls></audio></td></tr>';
console.log(channelHTML);
});
//
jQuery('.day-container').click(function() {
jQuery(this).prev('.highlighter').find('.content').hide();
jQuery(this).children('.content').animate({width: 'toggle'});
jQuery(this).toggleClass('highlighter');
});
jQuery('#conv_table_one').append(channelHTML);
});
jQuery('.showSingle').on('click', function () {
jQuery(this).addClass('selected').siblings('.anchor').removeClass('selected');
jQuery('.goal-metrics').hide();
jQuery('.chart-' + jQuery(this).data('target') + '-container').show();
});
jQuery('.showSingle').first().click();
//this one works just fine
jQuery.getJSON(NewConvData, function(data3) {
jQuery.each(data3.results, function(i, value) {
TotalCount = data3.results.length;
var phoneNumbers = data3.results[i].caller_id;
if ( !phoneNumbers.match(/^(\+?1)?(8(00|44|55|66|77|88)[2-9]\d{6})$/) && data3.results[i].duration > 90 && data3.results[i].disposition === "ANSWERED") {
ValueCalls+++1;
ValueCallMinutes += parseFloat(data3.results[i].duration) / 60;
}
if (value.disposition === "ANSWERED") {DispositionAnswered++;}
if (value.disposition === "NO ANSWER") {DispositionNoAnswer++;}
TotalCallMin += parseFloat(data3.results[i].duration) / 60;
AvgCallDuration = TotalCallMin / TotalCount;
jQuery.each(data3.results, function(i, value) {
channelHTML += '<tr><td class="tg-yw4l">' + data3.results[i].calldate + '</td><td class="tg-yw4l">' + data3.results[i].tracking_number + '</td><td class="tg-yw4l">' + data3.results[i].disposition + '</td><td class="tg-yw4l">' + data3.results[i].duration + '</td><td class="tg-yw4l">' + data3.results[i].id + '</td><td class="tg-yw4l">' + data3.results[i].is_outbound + '</td><td class="tg-yw4l">' + data3.results[i].ouid + '</td><td class="tg-yw4l">' + data3.results[i].repeat_call + '</td><td class="tg-yw4l">' + data3.results[i].caller_id + '</td><td class="tg-yw4l">' + data3.results[i].ringto_number + '</td><td class="tg-yw4l"><audio src="' + data3.results[i].file_url + '" controls></audio></td></tr>';
});
jQuery('#TotalCount span').html(TotalCount);
jQuery('#DispositionAnswered span').html(DispositionAnswered);
jQuery('#DispositionNoAnswer span').html(DispositionNoAnswer);
jQuery('#TotalCallMin span').html(TotalCallMin.toFixed(2));
jQuery('#AvgCallDuration span').html(AvgCallDuration.toFixed(2));
jQuery('#ValueCalls span').append(ValueCalls);
jQuery('#ValueCallMinutes span').html(ValueCallMinutes.toFixed(2));
jQuery('#conv_table_two').append(channelHTML);
});
});
//End
});
这是HTML:
<div id="monthly-calendar">
<ul id="weather_report" class="week ng-scope first">
</ul>
</div>
<div>
<table class="tg" id="conv_table_one" border='1'>
<tr>
<th class="tg-yw4l">Call Date</th>
<th class="tg-yw4l">Tracking Number</th>
<th class="tg-yw4l">Disposition</th>
<th class="tg-yw4l">Duration</th>
<th class="tg-yw4l">ID</th>
<th class="tg-yw4l">Is Outbound</th>
<th class="tg-yw4l">OUID</th>
<th class="tg-yw4l">Repeat Call</th>
<th class="tg-yw4l">Caller ID</th>
<th class="tg-yw4l">Ring To Number</th>
<th class="tg-yw4l">Play Audio File</th>
</tr>
</table>
<table class="tg" id="conv_table_two" border='1'>
<tr>
<th class="tg-yw4l">Call Date</th>
<th class="tg-yw4l">Tracking Number</th>
<th class="tg-yw4l">Disposition</th>
<th class="tg-yw4l">Duration</th>
<th class="tg-yw4l">ID</th>
<th class="tg-yw4l">Is Outbound</th>
<th class="tg-yw4l">OUID</th>
<th class="tg-yw4l">Repeat Call</th>
<th class="tg-yw4l">Caller ID</th>
<th class="tg-yw4l">Ring To Number</th>
<th class="tg-yw4l">Play Audio File</th>
</tr>
</table>
</div>
这也是一个小提琴:https://jsfiddle.net/javapatriot/k3cvb720/
注意:您的浏览器可能会因为拉入数据而挂断。 SORRY!
答案 0 :(得分:0)
$.when().done()
将在您必须更新元素的代码之后运行。
而不是:
jQuery.when(
jQuery.getJSON(NewConvData),
jQuery.getJSON(GoalValueTotals)
).done (function (data, data2) {
// result processing code
});//end of `done()`
jQuery('.totalinv').append(totalcost);
jQuery('.totalleads').append(totalcompletions);
jQuery('.perleadvalue').append(perleadvalue);
将追加代码移动到回调
中jQuery.when(
jQuery.getJSON(NewConvData),
jQuery.getJSON(GoalValueTotals)
).done (function (data, data2) {
// result processing code
jQuery('.totalinv').append(totalcost);
jQuery('.totalleads').append(totalcompletions);
jQuery('.perleadvalue').append(perleadvalue);
});//end of `done()`