追加 JSON 嵌套对象
Append JSON Nested Object
我最近不得不更改列的字段类型,这改变了数据的布局,因为它现在是多选字段类型。
原来通过fetch拉取的JSON是这样的:
d: {
"results": [
{
"MajorTasks": null,
"DeliverablesSubmitted": null,
"PersonnelActions": null,
"Upcoming": "\r\n <div>None at this time</div>\r\n",
"Training": null,
"ResourceRequest": "\r\n <div>None at this time.</div>\r\n",
"SupportRequest": "\r\n <div>None at this time.</div>\r\n",
"Team": "AMMO",
},
现在正在拉取的新JSON,嵌套Team栏目:
d: {
"results": [
{
"MajorTasks": null,
"DeliverablesSubmitted": null,
"PersonnelActions": null,
"Upcoming": "\r\n <div>None at this time</div>\r\n",
"Training": null,
"ResourceRequest": "\r\n <div>None at this time.</div>\r\n",
"SupportRequest": "\r\n <div>None at this time.</div>\r\n",
"Team": {
"__metadata": {
"type": "Collection(Edm.String)"
},
"results": [
"AMMO"
]
},
我注意到除了 Team 项目之外的所有内容都在追加时它发生了变化,并且在追加时显示 [object Object]。
如果除 Team 之外的所有内容都通过 data[i].valueName 附加,我猜正确的语法是什么。
这是我的 JS:
function loadData(url) {
url = partUrl + "/_api/web/lists/getbytitle('WeeklyReport')/items?$select=DeliverablesSubmitted,MajorTasks,PersonnelActions,SupportRequest,ResourceRequest,Team/Value,Training,Upcoming,WeekOf,TravelODC";
return fetch(url, { headers: { accept: "application/json; odata=verbose" } }) // make request
.then((r) => {
if (!r.ok) throw new Error("Failed: " + url); // Check for errors
return r.json(); // parse JSON
})
.then((data) => data.d.results);
}
loadData()
.then((results) => {
const data = results;
var listContent = '';
for (var i = 0; i < data.length; i++) {
var currData = data[i];
listContent += '<li data-weekOf="'+ currData.WeekOf+'">';
listContent += '<h2>' + currData.Team +'</h2>';
listContent += '<h4> Tasks </h4>';
if(currData.MajorTasks !== null){
listContent += '<ul>' + "- " + currData.MajorTasks.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Deliverables Submitted</h4>';
if(currData.DeliverablesSubmitted !== null){
listContent += '<ul>' + "- " + currData.DeliverablesSubmitted.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Personnel Actions </h4>';
if(currData.PersonnelActions !== null){
listContent += '<ul>' + "- " + currData.PersonnelActions.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Upcoming Events </h4>';
if(currData.Upcoming !== null){
listContent += '<ul>' + "- " + currData.Upcoming.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Training </h4>';
if(currData.Training !== null){
listContent += '<ul>' + "- " + currData.Training.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Resource Request </h4>';
if(currData.ResourceRequest !== null){
listContent += '<ul>' + "- " + currData.ResourceRequest.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Support Request </h4>';
if(currData.SupportRequest !== null){
listContent += '<ul>' + "- " + currData.SupportRequest.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Travel/ODCs </h4>';
if(currData.TravelODC !== null){
listContent += '<ul>' + "- " + currData.TravelODC.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '</li>';
}
$('#report-summary').html(listContent);
$('#under_txt').text(' ');
});
$(document).ready(function(){
$("#myInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
$('#under_txt').text(value);
$('li').fadeOut(10);
$('[data-weekOf='+value+']').fadeIn();
});
});
function sortNewestFirst(){
var elements = $('[data-weekOf]');
elements.sort(function (a, b) {
return new Date($(b).attr('data-weekOf')) - new Date($(a).attr('data-weekOf'));
});
$('#report-summary').html(elements);
}
function sortOldestFirst(){
var elements = $('[data-weekOf]');
elements.sort(function (a, b) {
return new Date($(a).attr('data-weekOf')) - new Date($(b).attr('data-weekOf'));
});
$('#report-summary').html(elements);
}
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function (element, renderer) {
return true;
}
};
$('#cmd').click(function () {
doc.fromHTML($('#report-summary').html(), 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
doc.save('weeklyreport.pdf');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
在这种情况下:
data[i].Team.results[0]
我为解决此问题所做的工作是:
for (var i = 0; i < data.length; i++) {
var currData = data[i];
listContent += '<li data-weekOf="'+ currData.WeekOf+'">';
if(currData.Team !== null){
listContent += '<h2>' + currData.Team.results.join(', ') +'</h2>';
}else{
listContent += '<h2>' + "Null" +'</h2>';
}
我最近不得不更改列的字段类型,这改变了数据的布局,因为它现在是多选字段类型。
原来通过fetch拉取的JSON是这样的:
d: {
"results": [
{
"MajorTasks": null,
"DeliverablesSubmitted": null,
"PersonnelActions": null,
"Upcoming": "\r\n <div>None at this time</div>\r\n",
"Training": null,
"ResourceRequest": "\r\n <div>None at this time.</div>\r\n",
"SupportRequest": "\r\n <div>None at this time.</div>\r\n",
"Team": "AMMO",
},
现在正在拉取的新JSON,嵌套Team栏目:
d: {
"results": [
{
"MajorTasks": null,
"DeliverablesSubmitted": null,
"PersonnelActions": null,
"Upcoming": "\r\n <div>None at this time</div>\r\n",
"Training": null,
"ResourceRequest": "\r\n <div>None at this time.</div>\r\n",
"SupportRequest": "\r\n <div>None at this time.</div>\r\n",
"Team": {
"__metadata": {
"type": "Collection(Edm.String)"
},
"results": [
"AMMO"
]
},
我注意到除了 Team 项目之外的所有内容都在追加时它发生了变化,并且在追加时显示 [object Object]。
如果除 Team 之外的所有内容都通过 data[i].valueName 附加,我猜正确的语法是什么。
这是我的 JS:
function loadData(url) {
url = partUrl + "/_api/web/lists/getbytitle('WeeklyReport')/items?$select=DeliverablesSubmitted,MajorTasks,PersonnelActions,SupportRequest,ResourceRequest,Team/Value,Training,Upcoming,WeekOf,TravelODC";
return fetch(url, { headers: { accept: "application/json; odata=verbose" } }) // make request
.then((r) => {
if (!r.ok) throw new Error("Failed: " + url); // Check for errors
return r.json(); // parse JSON
})
.then((data) => data.d.results);
}
loadData()
.then((results) => {
const data = results;
var listContent = '';
for (var i = 0; i < data.length; i++) {
var currData = data[i];
listContent += '<li data-weekOf="'+ currData.WeekOf+'">';
listContent += '<h2>' + currData.Team +'</h2>';
listContent += '<h4> Tasks </h4>';
if(currData.MajorTasks !== null){
listContent += '<ul>' + "- " + currData.MajorTasks.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Deliverables Submitted</h4>';
if(currData.DeliverablesSubmitted !== null){
listContent += '<ul>' + "- " + currData.DeliverablesSubmitted.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Personnel Actions </h4>';
if(currData.PersonnelActions !== null){
listContent += '<ul>' + "- " + currData.PersonnelActions.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Upcoming Events </h4>';
if(currData.Upcoming !== null){
listContent += '<ul>' + "- " + currData.Upcoming.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Training </h4>';
if(currData.Training !== null){
listContent += '<ul>' + "- " + currData.Training.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Resource Request </h4>';
if(currData.ResourceRequest !== null){
listContent += '<ul>' + "- " + currData.ResourceRequest.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Support Request </h4>';
if(currData.SupportRequest !== null){
listContent += '<ul>' + "- " + currData.SupportRequest.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '<h4> Travel/ODCs </h4>';
if(currData.TravelODC !== null){
listContent += '<ul>' + "- " + currData.TravelODC.replace(/(<([^>]+)>)/gi, "") + '</ul>';
}else{
listContent += '<ul>' + "- There were no notes attached to this section." + '</ul>';
}
listContent += '</li>';
}
$('#report-summary').html(listContent);
$('#under_txt').text(' ');
});
$(document).ready(function(){
$("#myInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
$('#under_txt').text(value);
$('li').fadeOut(10);
$('[data-weekOf='+value+']').fadeIn();
});
});
function sortNewestFirst(){
var elements = $('[data-weekOf]');
elements.sort(function (a, b) {
return new Date($(b).attr('data-weekOf')) - new Date($(a).attr('data-weekOf'));
});
$('#report-summary').html(elements);
}
function sortOldestFirst(){
var elements = $('[data-weekOf]');
elements.sort(function (a, b) {
return new Date($(a).attr('data-weekOf')) - new Date($(b).attr('data-weekOf'));
});
$('#report-summary').html(elements);
}
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function (element, renderer) {
return true;
}
};
$('#cmd').click(function () {
doc.fromHTML($('#report-summary').html(), 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
doc.save('weeklyreport.pdf');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
在这种情况下:
data[i].Team.results[0]
我为解决此问题所做的工作是:
for (var i = 0; i < data.length; i++) {
var currData = data[i];
listContent += '<li data-weekOf="'+ currData.WeekOf+'">';
if(currData.Team !== null){
listContent += '<h2>' + currData.Team.results.join(', ') +'</h2>';
}else{
listContent += '<h2>' + "Null" +'</h2>';
}