检索两个列表,对值进行排序和比较,然后显示所有结果

Retrieve two lists, sort and compare values, then display all the results

本文关键字:比较 排序 然后 显示 结果 两个 检索 列表      更新时间:2023-09-26

我在SharePoint 2013 Online中有两个列表。我需要获取用户输入的键(字符串(的匹配值,对两个列表进行排序并将两个列表显示为一个列表。如果我能够使用 SQL 创建视图,那就太容易了。最好的解决方案似乎是只显示两个列表。

我尝试使用SPD链接源,但是"链接字段"选项从未显示,并且无预览SPD很糟糕(MS在想什么?工作流不可行。可以在"数据表视图"中编辑列表项(客户端要求(。查找需要选择才能显示相关字段。

我可以获取两个列表并分别显示它们。

我有什么:

List 1                          List 2
fruit apple  type rome          fruit apple  state washington
fruit pear   type bartlett      fruit pear   state oregon
fruit grapes type red           fruit orange state florida

我想要什么:

fruit apple  type rome      state washington 
fruit grapes type red 
fruit orange                state florida
fruit pear   type bartlett  state oregon

我缺少两件事(也许更多(一个可用于排序的数组和一个用于匹配两个列表中的水果的比较。实际列表可能有 50-120 个项目(每个(需要匹配。

所有物品都应退回。如果存在匹配项,则数据应位于同一行中。否则,应显示空白。

下面的代码通过 html 页面显示,其中每个表格单元格的 ID 与以下脚本中的单元格引用匹配。它未排序,行不匹配。

$(function() {
    $.ajax({
    url: "sharepointlist/_api/web/lists/GetByTitle('List1')/items",
    type: "GET",
    headers: { "accept": "application/json;odata=verbose"
      }, 
    }).success(function (data) {
        var title = '';
        var type = '';
         $.each(data.d.results, 
        function (key, value) {
        title += "Title: " + value.Title + "<br/>";
        type += "Type: " + value.Type  + "<br/>";
        }); 
    $("#tdtitle").html(title);
    $("#tdtype").html(status);
$.ajax({
    url: "sharepointlist/_api/web/lists/GetByTitle('List2')/items",
    type: "GET",
    headers: { "accept": "application/json;odata=verbose"
      }, 
    }).success(function (data) {
        var title2 = '';
        var state = '';
         $.each(data.d.results, 
        function (key, value) {
        title2 += "Title2: " + value.Title + "<br/>";
        city += "State: " + value.State + "<br/>";
        }); 
    $("#tdsecond").html(title2);
    $("#tdstate").html(city);

您似乎正在尝试对从 REST 查询返回的列表项执行"连接"操作。如果是这样,您可以考虑以下方法

function getListItems(webUrl,listTitle,selectProperties){
   return $.getJSON( webUrl + "/_api/web/lists/GetByTitle('" + listTitle + "')/items?$select=" + selectProperties.join(','))
   .then(function(data){
        return data.value.map(function(item){
             return selectProperties.reduce(function(result, key) { 
                 result[key] = item[key]; 
                 return result; 
             },{});    
        });
    });    
}

function joinListItems(left, right, key) {
    if(left.length == 0 || right.length == 0)
        return new Error("No data was found");

    var columns = Object.keys(left[0]).concat(Object.keys(right[0]));
    var createRow = function(left,right){
        var row = {};
        columns.forEach(function(key){
          row[key] = null;
        });
        var values = left != null ? left : right;
        for(var name in values) row[name] = values[name];
        return row;
    };
    var updateRow = function(existingRow,values){
        for(var name in values) existingRow[name] = values[name];
    };
    return left.concat(right).reduce(function(result, current, index){ 
      if(index < left.length){ 
           result.rows.push(createRow(current,null));   
           result.keys[current[key]] = index;
      }
      else {
           var rowIdx = result.keys[current[key]];
           if(typeof rowIdx !== 'undefined'){
               updateRow(result.rows[rowIdx],current);
           }
           else {
               result.rows.push(createRow(null,current));
           }
      } 
      return result;
    },{rows: [], keys: {}}).rows;
}

$.when(
    // Get List1
    getListItems( _spPageContextInfo.webAbsoluteUrl, "List1",['Title','Type']),
    // Get List2
    getListItems( _spPageContextInfo.webAbsoluteUrl, "List2",['Title','State'])
)
.then(function(items1,items2){
    var key='Title';
    var result = joinListItems(items1,items2,key);
    result = result.sort(function(a, b){
        return a.Title.localeCompare(b.Title);
    });
    console.log(JSON.stringify(result,null,2));
    //displayResults(result);
});

//print results (from comment section) 
function displayResults(items){
   var title = ''; 
   var type = ''; 
   $.each(items, function (index, item) { 
       title += "Title: " + item.Title + "<br/>"; 
       type += "Type: " + item.Type + "<br/>"; 
   });
}

您可能还会发现此线程很有帮助,专门讨论 加入操作。

结果

[
  {
    "Title": "fruit apple",
    "Type": "type rome",
    "State": "state washington"
  },
  {
    "Title": "fruit grapes",
    "Type": "type red",
    "State": null
  },
  {
    "Title": "fruit orange",
    "State": "state florida",
    "Type": null
  },
  {
    "Title": "fruit pear",
    "Type": "type bartlett",
    "State": "state oregon"
  }
]

更新排序功能

取代:

 result = result.sort(function(a, b){
    return a.Title.localeCompare(b.Title);
});

result = result.sort(function(a, b){
    if(!a.Title) a.Title = "";
    if(!b.Title) b.Title = "";
    return a.Title.localeCompare(b.Title);
});
我会将

任务分为两部分。

首先,您需要合并从GET调用中检索到的数据。

您可以考虑以某种方式对此使用承诺:

$.when(
    // Get List1
    $.get("sharepointlist/_api/web/lists/GetByTitle('List1')/item").then( function(data) {
        return data.d.results;
    }),
    // Get List2
    $.get("sharepointlist/_api/web/lists/GetByTitle('List2')/items").then( function(data) {
        return data.d.results;
    })
).then(processData);
function processData(list1, list2) {
    var res = list1.concat(list2);
}

现在您需要处理您的数据。首先,您按Title对新数组进行排序。

newData = newData.sort(function(a, b){
    return a.Title.localeCompare(b.Title);
});

现在,您需要遍历排序的数据并组合具有相同标题的对象。

res = res.reduce(function(a, b) {
    var t = a.slice(-1)[0]; //it's like getting last element
    if (t && t.Title === b.Title) {
        if (b.State) {
            t.State = b.State;
        } else {
            t.Type = b.Type;
        }
    } else {
        a.push(b);
    }
    return a;
}, []);

现在只需将新数据分配到 DOM 中即可。

更新:

使用 jQuery $.extend() 连接元素时合并所有属性的示例。

res = res.reduce(function(a, b) {
            var t = a.slice(-1)[0]; //it's like getting last element
            if (t && t.Title === b.Title) {
                $.extend(t, b);
            } else {
                a.push(b);
            }
            return a;
        }, []);

PS:jQuery $.extend()忽略,属性为空或未定义。

指向 Plunkr 中带有硬编码 JSON 文件的工作解决方案的链接。

https://plnkr.co/edit/gYJjyT8lCCNTe6EAlSYB