51CTO 博客地址：https://blog.51cto.com/13969817
本文将给大家分享和讨论如何在SharePoint Online的列表中使用REST API 插入或删除item。
我们以名为员工信息列表(CompanyMemberInfo)为例，该列表有两个column：名称和部门，在这个特定的例子中，我们以两个textbox为例，一个用于标题，一个用于部门，一个用于提交按钮，点击提交按钮，该项目将添加到SharePoint Online的列表中。
所有HTML代码和REST API代码，我们将放在SharePoint的Web part页面的一个script editor的web part中。
使用REST API插入item
HTML Code：
<div id="AddListData">
<div>
Title:
<br />
<input type="text" id="txtTitle" />
</div>
<div>
Industry:
<br />
<input type="text" id="txtDivision" />
</div>
<br />
<div>
<input id="btnSubmit" type="button" value="Submit" />
</div>
</div>
<div id="divResult"></div>
REST API Code：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js "></script>
<script>
$(function () {
bindButtonClick();
});
function bindButtonClick() {
$("#btnSubmit").on("click", function () {
addListItem();
});
}
function addListItem() {
var title = $("#txtTitle").val();
var division = $("#txtdivision").val();
var siteUrl = _spPageContextInfo.webAbsoluteUrl;
var fullUrl = siteUrl + "/_api/web/lists/GetByTitle('CompanyMemberInfo')/items";
$.ajax({
url: fullUrl,
type: "POST",
data: JSON.stringify({
'__metadata': { 'type': 'SP.Data. CompanyMemberInfoListItem' },
'Title': title,
'division': division
}),
headers: {
"accept": "application/json;odata=verbose",
"content-type": "application/json;odata=verbose",
"X-RequestDigest": $("#__REQUESTDIGEST").val()
},
success: onQuerySucceeded,
error: onQueryFailed
});
}
function onQuerySucceeded(sender, args) {
$("#divResult").html("Item successfully added!");
}
function onQueryFailed() {
alert('Error!');
}
</script>
使用REST API删除要删除的item
现在我们将讨论如何使用SharePoint Online中的REST API从列表中删除项目，这里，我们将基于列表的ID删除item，我们使用一个textbox，用户可将item id放入textbox中，在提交按钮上，item将从列表中删除。
以CompanyMemberInfo列表，其ID=2为例，HTML Code如下：
<div>
Enter ID to Delete: <input type="text" id="txtId" />
</div>
<div>
<input id="btnSubmit" type="button" value="Submit" />
</div>
<div id="divResult"></div>
REST API Code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js "></script>
<script>
$(function () {
bindButtonClick();
});
function bindButtonClick() {
$("#btnSubmit").on("click", function () {
deleteListItem();
});
}
function deleteListItem() {
var id = $("#txtId").val();
var siteUrl = _spPageContextInfo.webAbsoluteUrl;
var fullUrl = siteUrl + "/_api/web/lists/GetByTitle('CompanyMemberInfo')/items(" + id + ")";
$.ajax({
url: fullUrl,
type: "POST",
headers: {
"accept": "application/json;odata=verbose",
"content-type": "application/json;odata=verbose",
"X-RequestDigest": $("#__REQUESTDIGEST").val(),
"X-HTTP-Method": "DELETE",
"IF-MATCH": "*"
},
success: onQuerySucceeded,
error: onQueryFailed
});
}
function onQuerySucceeded(sender, args) {
$("#divResult").html("Item successfully deleted!");
}
function onQueryFailed() {
alert('Error!');
}
</script>
谢谢阅读，若有问题欢迎线下留言讨论 ~