使用JQuery调用SharePoint Rest API中的Batch命令批量添加,更新item

在SharePoint Framework中使用JQuery,调用SharePoint Rest API批量添加,更新item。这里使用Rest API中的Batch命令。

1, 创建项目

请参考这个微软官方文档创建SPFx项目: https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/add-jqueryui-accordion-to-web-part

2, 修改UI,添加按钮和按钮事件。

public render(): void {
    this.domElement.innerHTML = `
      <div class="${ styles.demoCi }">
        <div class="${ styles.container }">
          <div class="${ styles.row }">
            <div class="${ styles.column }">
              <span class="${ styles.title }">Welcome to SharePoint!</span>
              <p class="${ styles.subTitle }">Customize SharePoint experiences using Web Parts.</p>
              <p class="${ styles.description }">${escape(this.properties.description)}</p>
              <div class="${ styles.row }">
                <span class="${styles.title}">Create items</span>
                <button class="${styles.button}" id="createButton"><span>Create</span></button>
              </div>
              <div class="${ styles.row }">
                <span class="${styles.title}">Update items</span>
                <button class="${styles.button}" id="updateButton"><span>Update</span></button>
              </div>
            </div>
          </div>
        </div>
      </div>`;
      
      this.bindButtonEvent();

  }

  private bindButtonEvent() {
    const webpart:DemoCiWebPart = this;
    this.domElement.querySelector("#createButton").addEventListener('click', ()=> {webpart.createNewItem();});
    this.domElement.querySelector("#updateButton").addEventListener('click', ()=> {webpart.updateItem();});
  }

3, 解决403 digist令牌问题

首先添加一个方法,做一个简单的JQuery调用Rest API的测试:

jQuery.ajax({
    url: this.context.pageContext.web.absoluteUrl + "/_api/web/lists/GetByTitle('MyTestList')",
    method: "POST",
    headers
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值