正确处理JSOM clientcontext

时间:2017-08-09 11:28:04

标签: sharepoint sharepoint-jsom

我在Sharepoint 2016中尝试使用JSOM。我制作了一个包含以下代码的WebPart -

<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());
        }
    });

此代码的作用是什么 -

  1. 在文档加载准备
  2. user-output div中显示用户信息
  3. 单击添加电影按钮时保存电影记录
  4. 但是,出于某种原因,单击添加电影按钮时,代码会添加两部电影而不是一部。我认为它与ClientContext有关。但我不确定为什么,或者如何解决它。有人可以帮忙吗?

1 个答案:

答案 0 :(得分:0)

我不确定它是如何发生的,或者它是否是一个错误,但在摆弄页面来源以找出为什么发生双重发布时,我看到我的网页部件代码在页面中呈现两次。一部分是可见的,另一部分是隐藏的div。但是,当我去编辑页面删除隐藏的Web部分时,我无法做到。所以我将页面恢复为模板版本并重新添加了Web部件。之后,Web部件正常工作。代码没有问题。

相关问题