通过Js检索共享点列表

时间:2019-12-14 15:12:37

标签: javascript html sharepoint

我创建了一个包含四列的共享点列表。我将其命名为:姓名,职位,办公室,薪水。 您能帮我如何从列表中检索项目(使用JavaScript)吗?

2 个答案:

答案 0 :(得分:3)

您可以在需要替换网站网址,列表和列的地方使用以下示例代码:

使用JavaScript编码获取SharePoint列表项:

var siteUrl = 'https://siteUrl';
var listName= 'MyCustomListName';

function retrieveListItems()
 {
var clientContext = new SP.ClientContext(siteUrl);
var oList = clientContext.get_web().get_lists().getByTitle(listName);
var camlQuery = new SP.CamlQuery();
camlQuery.set_viewXml('<View><Query><Where><Geq><FieldRef Name=\'ID\'/>' + 
'<Value Type=\'Number\'>1</Value></Geq>
</Where></Query><RowLimit>10</RowLimit></View>');
this.collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), 
Function.createDelegate(this, this.onQueryFailed));        
}
functiononQuerySucceeded(sender, args)
{


var listItemInfo = '';
var listItemEnumerator = collListItem.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
listItemInfo += '\nID: ' + oListItem.get_id() + 
'\nName: ' + oListItem.get_item('Name') + 
'\nPosition: ' + oListItem.get_item('Position')+ 
'\nOffice: ' + oListItem.get_item('Office') + 
'\nSalary: ' + oListItem.get_item('Salary');
    }
alert(listItemInfo.toString());
}
functiononQueryFailed(sender, args)
{
alert('Request failed. ' +args.get_message() + '\n' + args.get_stackTrace());
}

使用REST API编码获取SharePoint列表项:

function retriveListItem()                                                
{
var resultGridHtmlMySubmission=''
  $.ajax (
          {
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('<SampleListName(yourlistTitle)>')/items?$select=Title,Name,Position,Office,Salary",
type: "GET",
data: JSON.stringify,
headers:
{
"Accept": "application/json;odata=verbose",
"Content-Type": "application/json;odata=verbose",
"X-RequestDigest": $("#__REQUESTDIGEST").val(),
"IF-MATCH": "*",
"X-HTTP-Method": null
},
cache: false,
success: function(data)  
{ 
for (vari = 0; i<data.d.results.length; i++)
{
var item = data.d.results[i];
resultGridHtmlMySubmission+='<tr>';
resultGridHtmlMySubmission+='<tdalign="center"   valign="middle"><span title="Sr.No."><b>'+item.Title+'</b></span></td>';
resultGridHtmlMySubmission+='<td align="center" valign="middle"><span title="Sr.No."><b>'+item.Name+'</b></span></td>';
resultGridHtmlMySubmission+='<td align="center" valign="middle"><span title="Sr.No."><b>'+item.Position+'</b></span></td>';
resultGridHtmlMySubmission+='<td align="center" valign="middle"><span title="Sr.No."><b>'+item.Office+'</b></span></td>';
resultGridHtmlMySubmission+='<td align="center" valign="middle"><span title="Sr.No."><b>'+item.Salary+'</b></span></td>';
resultGridHtmlMySubmission+='</tr>';

  }
$("#tbodycontent").html(resultGridHtmlMySubmission);
},
error: function(data)
{
// $("#ResultDiv").empty().text(data.responseJSON.error);
}
});
}

参考网址:

http://ramdotnetdeveloper.blogspot.com/2016/08/crud-operation-in-sharepoint-2013.html?m=1

答案 1 :(得分:1)

以下示例代码供您参考,将其添加到站点页面中的脚本编辑器Web部件中。

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
    var listName="CL1216";
    $.ajax({
        url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/getByTitle('"+listName+"')/items",
        type: "GET",
        headers: {
            "Accept": "application/json;odata=verbose",
        },
        success: function (data) {            
            var htmlTable="<table><thead><tr><th>Name</th><th>Position</th><th>Office</th><th>Salary</th></tr></thead><tbody>";
            $.each(data.d.results,function(i,item){
                htmlTable+="<tr><td>"+item.Name+"</td><td>"+item.Position+"</td><td>"+item.Office+"</td><td>"+item.Salary+"</td></tr>";
            });
            htmlTable+="</tbody></table>";
            $("#ListData").html(htmlTable);
        },
        error: function (data) {
            console.log("Error");
        }
    });
})
</script>
<div id="ListData"/>

enter image description here