Want to display Task and sub-task using the rest api jquery. My query string displays task and sub-task as individual unrelated task.
4
-
function onQuerySucceeded(data) { var mainTasks = []; var subTasks = []; for(var i = 0; i < data.length; i++) { if(data[i].ParentID.Id) { subTasks.push(data[i]); } else { mainTasks.push(data[i]); } } $("#divTaskItems").html(mainTasks); $("#divSubTaskItems").html(subTasks); } function onQueryFailed() { console.log('Error!'); }Ben Segarra– Ben Segarra2018-11-30 17:16:55 +00:00Commented Nov 30, 2018 at 17:16
-
above is the code I am using to bind dataBen Segarra– Ben Segarra2018-11-30 17:17:16 +00:00Commented Nov 30, 2018 at 17:17
-
You cannot directly put array variables in html. You need to iterate those array and write each value in html using javascript.Ganesh Sanap - MVP– Ganesh Sanap - MVP2018-11-30 17:21:54 +00:00Commented Nov 30, 2018 at 17:21
-
Check this and this link... How to bind data to htmlGanesh Sanap - MVP– Ganesh Sanap - MVP2018-11-30 17:25:52 +00:00Commented Nov 30, 2018 at 17:25
Add a comment
|
1 Answer
In SharePoint Tasks List, for each subtask there is one hidden field ParentID in list. ParentID is maintained internally by SharePoint.
So, the list items having ParentID are the subtask. And you can group those subtasks based on ParentID using javascript code. Use below URL to get the ParentID of task items.
siteUrl/_api/web/lists/getbytitle('TasksList')/items?$select=*,ParentID/Id&$expand=ParentID
and then you can extract the main tasks and subtasks in separate arrays:
var mainTasks = [], subTasks = [];
for(var i = 0; i < data.length; i++) {
if(data[i].ParentID.Id) {
subTasks.push(data[i]);
} else {
mainTasks.push(data[i]);
}
}
answered Nov 29, 2018 at 6:22
Ganesh Sanap - MVP
47.4k22 gold badges32 silver badges64 bronze badges
-
I tried your code and it did not work, the info would not display on my page.Ben Segarra– Ben Segarra2018-11-30 17:09:11 +00:00Commented Nov 30, 2018 at 17:09
-
Code <body> <div id="divTaskItems"></div> <div id="divSubTaskItems">/div> <p>Get Site List via REST API Call</p>Ben Segarra– Ben Segarra2018-11-30 17:12:31 +00:00Commented Nov 30, 2018 at 17:12
-
function getListData() { //var siteUrl = _spPageContextInfo.webAbsoluteUrl; var fullUrl = "myurl/_api/web/lists/getbytitle('Tasks')/items?$select=*,ParentID/Id&$expand=ParentID"; $.ajax({ url: fullUrl, type: "GET", headers: { "accept": "application/json;odata=verbose", "content-type": "application/json;odata=verbose", }, success: onQuerySucceeded, error: onQueryFailed }); }Ben Segarra– Ben Segarra2018-11-30 17:13:39 +00:00Commented Nov 30, 2018 at 17:13
-
function onQuerySucceeded(data) { var mainTasks = []; var subTasks = []; for(var i = 0; i < data.length; i++) { if(data[i].ParentID.Id) { subTasks.push(data[i]); } else { mainTasks.push(data[i]); } } $("#divTaskItems").html(mainTasks); $("#divSubTaskItems").html(subTasks); }Ben Segarra– Ben Segarra2018-11-30 17:13:48 +00:00Commented Nov 30, 2018 at 17:13
-
This code is just to retrieve the list items and find the subtasks. It will not write the tasks on your page automatically. You need to fetch the tasks using this code and then write logic to bind this data on your page.Ganesh Sanap - MVP– Ganesh Sanap - MVP2018-11-30 17:14:11 +00:00Commented Nov 30, 2018 at 17:14