2017-08-09 51 views
0

我嘗試JSOM在Sharepoint 2016年我已經包含下面的代碼的WebPart -處理JSOM clientcontext正確

<div id="user-output"></div> 
Movie Title: <input type="text" id="movie-title" /><br /> 
Description: <input type="text" id="movie-description" /><br /> 
<button type="button" id="submit-button">Add Movie</button> 

<div id="movies-output"></div> 

<script type="text/javascript" src="/SiteAssets/jquery-3.2.1.min.js"></script> 
<script type="text/ecmascript" src="../_layouts/15/SP.UserProfiles.js"></script> 

<script type="text/javascript"> 
    $(function() { 

     $('#submit-button').on('click', function() { 
      var context = SP.ClientContext.get_current(); 
      var movies = context.get_web().get_lists().getByTitle('Movies'); 
      var movieCreationInfo = new SP.ListItemCreationInformation(); 
      var movie = movies.addItem(movieCreationInfo); 
      movie.set_item("Title", $('#movie-title').val()); 
      movie.set_item("MovieDescription", $('#movie-description').val()); 
      movie.update(); 
      context.load(movie); 

      context.executeQueryAsync(success, failure); 
     }); 

     function success() { 
      $('#movies-output').text('Created movie!'); 
     } 

     function failure() { 
      $('#movies-output').text('Something went wrong'); 
     } 

     var upp; 

     // Ensure that the SP.UserProfiles.js file is loaded before the custom code runs. 
     //SP.SOD.executeOrDelayUntilScriptLoaded(getUserProperties, 'SP.UserProfiles.js'); 
     SP.SOD.executeFunc('userprofile', 'SP.UserProfiles.PeopleManager', getUserProperties); 
     //SP.SOD.executeFunc('SP.UserProfiles.js', getUserProperties); 

     function getUserProperties() { 

      // Get the current client context and PeopleManager instance. 
      var clientContext = new SP.ClientContext.get_current(); 
      var peopleManager = new SP.UserProfiles.PeopleManager(clientContext); 

      upp = peopleManager.getMyProperties(); 
      clientContext.load(upp, 'UserProfileProperties'); 
      clientContext.executeQueryAsync(onRequestSuccess, onRequestFail); 
     } 

     // This function runs if the executeQueryAsync call succeeds. 
     function onRequestSuccess() { 
      $('#user-output').html('User Name: ' + upp.get_userProfileProperties()['PreferredName'] + 
       '<br/>Department: ' + upp.get_userProfileProperties()['Department'] + 
       '<br/>Designation: ' + upp.get_userProfileProperties()['Title'] + 
       '<br/>Employee ID: ' + upp.get_userProfileProperties()['EmployeeID'] + 
       '<br/>Branch Code: ' + upp.get_userProfileProperties()['branchCode'] 
       ); 
     } 

     // This function runs if the executeQueryAsync call fails. 
     function onRequestFail(sender, args) { 
      $('#user-output').text("Error: " + args.get_message()); 
     } 
    }); 

這段代碼所做的就是 - 在user-output

  1. 顯示用戶信息div文件加載準備
  2. 保存電影記錄時添加電影按鈕被點擊

但是,由於某些原因,當點擊添加電影按鈕時,代碼將添加兩個電影而不是一個。我認爲這與ClientContext有關。但我不知道爲什麼,或者如何解決它。誰能幫忙?

回答

0

我不確定它是如何發生的,或者它是一個錯誤,但是在查找頁面源代碼以找出發生雙重發布的原因時,我看到我的Web部件代碼在頁面中呈現兩次。其中一部分是可見的,另一部分是隱藏的部分。但是,當我去編輯頁面來刪除隱藏的Web部件時,我不能。所以我將我的頁面恢復到模板版本並重新添加了Web部件。之後,Web部件正常工作。代碼沒有問題。