无法在Sharepoint 2013列表中创建新项目

时间:2017-06-02 19:15:18

标签: jquery html ajax knockout.js sharepoint-2013

我正在尝试使用knockout js和REST将项目保存到SharePoint的列表中。在我的Ajax POST中,我使用了ko.toJSON。我尝试使用JSON.stringify,但我无法在SharePoint列表中看到该条目。我可能传递了错误的参数值。 提前谢谢。

我的HTML:

<link rel="Stylesheet" href="/css/default.css" />

<script type="text/javascript" src="/js/knockout-3.4.2.js"></script>
<script type="text/javascript" src="/js/jquery-3.2.1.min.js"></script>

<script type="text/javascript" src="/js/o.min.js"></script>

<form id="form1" runat="server"> 
<div class="style1"> 
<div class="codeRunner"><br/>


<h3>Tasks</h3>


<form data-bind="submit: addTask">
    Add task: <input data-bind="value: newTaskText" placeholder="What needs to be done?" />
    <button type="submit">Add</button>
</form>

<ul data-bind="foreach: tasks, visible: tasks().length > 0">
    <li>
        <input type="checkbox" data-bind="checked: isDone" />
        <input data-bind="value: title, disable: isDone" />
        <a href="#" data-bind="click: $parent.removeTask">Delete</a>
    </li> 
</ul>

You have <b data-bind="text: incompleteTasks().length">&nbsp;</b> incomplete task(s)
<span data-bind="visible: incompleteTasks().length == 0"> - it's water time!</span>

<br/>
<button data-bind="click: save">Save</button>

</div>
</div>
</form>

我的JS:

<script type="text/javascript">

var sharepointBaseUrl = "/trp/";
var sharepointTaskListUrl = sharepointBaseUrl + "_api/lists/getbytitle('Test2')";



function Task(sharepointItem) {
    var self = this;

    self.id = sharepointItem.ID;

    self.title = ko.observable(sharepointItem.Title);
    self.isDone = ko.observable(sharepointItem.IsDone);
}



function TaskListViewModel() {
    // Data
    var self = this;
    self.tasks = ko.observableArray([]);
    self.newTaskText = ko.observable();
    self.incompleteTasks = ko.computed( function() { return ko.utils.arrayFilter(self.tasks(), function(task) { return !task.isDone() }); });

    // Operations
    self.addTask = function() {
        self.tasks.push(new Task({ Title: this.newTaskText() }));
        self.newTaskText("");
        var itemType="SP.Data.Test2ListItem";
        var addedItems=ko.toJSON({
            __metadata: itemType,
            'Title': self.newTaskText()
        });

        $.ajax({
            url: sharepointTaskListUrl + "/items", 
            type: "POST",
            headers: {
                "accept": "application/json;odata=verbose",
                "X-RequestDigest": $("#__REQUESTDIGEST").val(),
                "content-Type": "application/json;odata=verbose"
            },
            data: addedItems,
            success: function (data) {
                console.log(data);
            },
            error: function (error) {
                alert(JSON.stringify(error));
            }
        });


    };
    self.removeTask = function(task) { self.tasks.remove(task) };



    //load from SP List
    $.ajax( {
            url: sharepointTaskListUrl + "/items", 
            method: "GET",
            headers: { "Accept": "application/json; odata=verbose" },
            success: function (data) 
                     {
                         var items = data.d.results;
                         items.forEach( function(item) { self.tasks.push(new Task(item)); } );
                     },
            error: function (data) { alert("ERROR: " + data) }
     } );




}

ko.applyBindings(new TaskListViewModel());


</script>

1 个答案:

答案 0 :(得分:0)

在您的源代码中:

    self.addTask = function() {
        self.tasks.push(new Task({ Title: this.newTaskText() }));
        self.newTaskText(""); (1)
        var itemType="SP.Data.Test2ListItem";
        var addedItems=ko.toJSON({
            __metadata: itemType,
            'Title': self.newTaskText()    (2)

在(1)中,您正在清除newTaskText()。 在(2)中你将它添加到你的json。

您可以更改为此解决方案:

    self.addTask = function() {
        var task = new Task({ Title: this.newTaskText() });
        self.tasks.push(task);
        self.newTaskText("");
        var itemType="SP.Data.Test2ListItem";
        var addedItems=ko.toJSON({
            __metadata: itemType,
            'Title': task.title()

在这里,我定义了一个task变量并从中获取标题。