使用 Javascript 按网页上的创建日期顺序从 SharePoint 库文件夹加载内容
Load Content from SharePoint Library Folder by Created Date Order on Webpage using Javascript
我正在使用 SharePoint,我能够使用 REST API 从库中加载内容并将其作为 link 显示在网页上。我想出了一种方法来按照“创建日期”将文档上传到文件夹的顺序排列内容,在顶部显示最后上传的项目。但是,我觉得有一种更有效的方法来执行此操作。我一起破解的脚本似乎有时会起作用。有时它会出现乱序,但当我刷新浏览器时,它会 return 它在所需序列中的项目中。下面是我用来完成此任务的代码。如果有更好的方法来完成此操作,我们将不胜感激。
<ul id="column1">
<h2 id="newsletter"><img style="width: 40px; position: relative; right: 5px; top: 7px;" src="../SiteAssets/SitePages/Test Page/icons/DCSA_Portal_Newsletter.svg" alt="logo">Newsletter<img id="arrow1" src="../SiteAssets/SitePages/Test Page/icons/arrow.png" alt="logo"></h2>
<ol></ol>
</ul>
getFilesFromFolder("/sites/dcsa/ep/epMainFiles/News/Newsletter").done(function(data) {
$.each(data.d.results, function(i, item) {
var spDate = new Date(item.TimeCreated.split('T')[0]) //example: '2015-10-30T05:00:00Z'
var newTillDate = new Date();
spDate.setDate(spDate.getDate() + 5);
if (spDate <= newTillDate) {
$("#column1 ol").append('<li class="linkData newsletter" style="padding-left: 10px; padding-right: 10px;" data-date="' + item.TimeCreated.split('T')[0] + '"><a href="' + 'https://intelshare.intelink.gov' + item.ServerRelativeUrl + '" target="_blank">' + item.Name.replace(/\.[^/.]+$/, "") + " - " + '<span style="color: red;">' + item.TimeCreated.split('T')[0] + '</span>' + '</a></li>');
} else {
$("#column1 ol").append('<li class="linkData newsletter" style="padding-left: 10px; padding-right: 10px;" data-date="' + item.TimeCreated.split('T')[0] + '"><a href="' + 'https://intelshare.intelink.gov' + item.ServerRelativeUrl + '" target="_blank"><img class="newArrow" style="width: 60px; position: relative; right: 5px; top: 0px;"src="../SiteAssets/SitePages/Test Page/icons/arrow-with_new2.gif" alt="logo">' + item.Name.replace(/\.[^/.]+$/, "") + " - " + '<span style="color: red;">' + item.TimeCreated.split('T')[0] + '</span>' + '</a></li>');
}
col1_chgOrder();
});
});
function col1_chgOrder() {
var container = $("#column1 ol");
var items = $("#column1 ol .linkData");
items.each(function() {
// Convert the string in 'data-event-date' attribute to a more
// standardized date format
var BCDate = $(this).attr("data-date");
/*console.log(BCDate);
var standardDate = BCDate[1]+" "+BCDate[0]+" "+BCDate[2];*/
var standartDate = new Date(BCDate).getTime();
$(this).attr("data-event-date", standartDate);
//console.log(standartDate);
});
items.sort(function(a, b) {
a = parseFloat($(a).attr("data-event-date"));
b = parseFloat($(b).attr("data-event-date"));
return a < b ? -1 : a > b ? 1 : 0;
}).each(function() {
container.prepend(this);
});
}
function getFilesFromFolder(serverRelativeUrlToFolder) {
return $.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/GetFolderByServerRelativeUrl('" + serverRelativeUrlToFolder + "')/files",
method: "GET",
async: false,
headers: {
"Accept": "application/json; odata=verbose"
}
});
}
您可以在 API 端点 url 中包含 orderby
过滤器,而不是在收到响应后进行排序。
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/GetFolderByServerRelativeUrl('" + serverRelativeUrlToFolder + "')/files?&$orderby=Created desc
即您不需要使用 col1_chgOrder()
函数,因为 API 将 return 文件由于此参数
已经排序
使用Jsom按顺序通过caml查询获取文件。
<script type="text/javascript">
$(function () {
ExecuteOrDelayUntilScriptLoaded(retrieveFiles, "sp.js");
})
function retrieveFiles() {
var ctx = SP.ClientContext.get_current();
var docLib = ctx.get_web().get_lists().getByTitle("MyDoc");
var camlQuery = new SP.CamlQuery();
camlQuery.set_viewXml(
"<View Scope='RecursiveAll'><Query><OrderBy><FieldRef Name=\"Created\" Ascending=\"False\"/></OrderBy></Query></View>");
camlQuery.set_folderServerRelativeUrl("/MyDoc/FolderA");
var Files = docLib.getItems(camlQuery);
ctx.load(Files);
ctx.executeQueryAsync(Function.createDelegate(this, function () {
var listItemEnumerator = Files.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
alert(oListItem.get_id());
}
}), Function.createDelegate(this, function () {
alert('error');
}));
}
</script>
我正在使用 SharePoint,我能够使用 REST API 从库中加载内容并将其作为 link 显示在网页上。我想出了一种方法来按照“创建日期”将文档上传到文件夹的顺序排列内容,在顶部显示最后上传的项目。但是,我觉得有一种更有效的方法来执行此操作。我一起破解的脚本似乎有时会起作用。有时它会出现乱序,但当我刷新浏览器时,它会 return 它在所需序列中的项目中。下面是我用来完成此任务的代码。如果有更好的方法来完成此操作,我们将不胜感激。
<ul id="column1">
<h2 id="newsletter"><img style="width: 40px; position: relative; right: 5px; top: 7px;" src="../SiteAssets/SitePages/Test Page/icons/DCSA_Portal_Newsletter.svg" alt="logo">Newsletter<img id="arrow1" src="../SiteAssets/SitePages/Test Page/icons/arrow.png" alt="logo"></h2>
<ol></ol>
</ul>
getFilesFromFolder("/sites/dcsa/ep/epMainFiles/News/Newsletter").done(function(data) {
$.each(data.d.results, function(i, item) {
var spDate = new Date(item.TimeCreated.split('T')[0]) //example: '2015-10-30T05:00:00Z'
var newTillDate = new Date();
spDate.setDate(spDate.getDate() + 5);
if (spDate <= newTillDate) {
$("#column1 ol").append('<li class="linkData newsletter" style="padding-left: 10px; padding-right: 10px;" data-date="' + item.TimeCreated.split('T')[0] + '"><a href="' + 'https://intelshare.intelink.gov' + item.ServerRelativeUrl + '" target="_blank">' + item.Name.replace(/\.[^/.]+$/, "") + " - " + '<span style="color: red;">' + item.TimeCreated.split('T')[0] + '</span>' + '</a></li>');
} else {
$("#column1 ol").append('<li class="linkData newsletter" style="padding-left: 10px; padding-right: 10px;" data-date="' + item.TimeCreated.split('T')[0] + '"><a href="' + 'https://intelshare.intelink.gov' + item.ServerRelativeUrl + '" target="_blank"><img class="newArrow" style="width: 60px; position: relative; right: 5px; top: 0px;"src="../SiteAssets/SitePages/Test Page/icons/arrow-with_new2.gif" alt="logo">' + item.Name.replace(/\.[^/.]+$/, "") + " - " + '<span style="color: red;">' + item.TimeCreated.split('T')[0] + '</span>' + '</a></li>');
}
col1_chgOrder();
});
});
function col1_chgOrder() {
var container = $("#column1 ol");
var items = $("#column1 ol .linkData");
items.each(function() {
// Convert the string in 'data-event-date' attribute to a more
// standardized date format
var BCDate = $(this).attr("data-date");
/*console.log(BCDate);
var standardDate = BCDate[1]+" "+BCDate[0]+" "+BCDate[2];*/
var standartDate = new Date(BCDate).getTime();
$(this).attr("data-event-date", standartDate);
//console.log(standartDate);
});
items.sort(function(a, b) {
a = parseFloat($(a).attr("data-event-date"));
b = parseFloat($(b).attr("data-event-date"));
return a < b ? -1 : a > b ? 1 : 0;
}).each(function() {
container.prepend(this);
});
}
function getFilesFromFolder(serverRelativeUrlToFolder) {
return $.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/GetFolderByServerRelativeUrl('" + serverRelativeUrlToFolder + "')/files",
method: "GET",
async: false,
headers: {
"Accept": "application/json; odata=verbose"
}
});
}
您可以在 API 端点 url 中包含 orderby
过滤器,而不是在收到响应后进行排序。
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/GetFolderByServerRelativeUrl('" + serverRelativeUrlToFolder + "')/files?&$orderby=Created desc
即您不需要使用 col1_chgOrder()
函数,因为 API 将 return 文件由于此参数
使用Jsom按顺序通过caml查询获取文件。
<script type="text/javascript">
$(function () {
ExecuteOrDelayUntilScriptLoaded(retrieveFiles, "sp.js");
})
function retrieveFiles() {
var ctx = SP.ClientContext.get_current();
var docLib = ctx.get_web().get_lists().getByTitle("MyDoc");
var camlQuery = new SP.CamlQuery();
camlQuery.set_viewXml(
"<View Scope='RecursiveAll'><Query><OrderBy><FieldRef Name=\"Created\" Ascending=\"False\"/></OrderBy></Query></View>");
camlQuery.set_folderServerRelativeUrl("/MyDoc/FolderA");
var Files = docLib.getItems(camlQuery);
ctx.load(Files);
ctx.executeQueryAsync(Function.createDelegate(this, function () {
var listItemEnumerator = Files.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
alert(oListItem.get_id());
}
}), Function.createDelegate(this, function () {
alert('error');
}));
}
</script>