SharePoint Online 开发篇:如何使用REST API插入或删除Item

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>

谢谢阅读,若有问题欢迎线下留言讨论 ~


上一篇:【DBCA -SILENT】静默安装之rac数据库安装


下一篇:2021noi online 自闭总结