SharePoint List Dao with TypeScript

July 12, 2014 3-minute read

sharepoint-2013 • sharepoint-apps • typescript

As I am now using TypeScript, I thought that it would be good to rewrite the GenericList script that I had provided a year ago.

Before to start, make sure that you’ve added TypeScript support to your Sharepoint solution, in order to do that I would suggest the reading of the following MSDN article by Marat Bakirov: Creating SharePoint solutions with TypeScript

Once that is done, you can find below the TypeScript code of the updated ListDao (previously GenericList).

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115


'use strict';

module Gobbe {
    export class ListDao {
        constructor(public listName: string) {
        }

        createItem(data: any, callback: Function) {
            $.ajax({
                url: _spPageContextInfo.webServerRelativeUrl +
                    "/_api/web/lists/getByTitle('" + this.listName + "')/items",
                type: "POST",
                contentType: "application/json;odata=verbose",
                data: data,
                headers: {
                    "accept": "application/json;odata=verbose",
                    "X-RequestDigest": $("#__REQUESTDIGEST").val()
                },
                success: () => {
                    if (callback !== undefined)
                        callback();
                },
                error: (err) => {
                    console.log(JSON.stringify(err));
                }
            });
        }

        getItems(callback: Function) {
            $.ajax(
            {
                url: _spPageContextInfo.webServerRelativeUrl +
                    "/_api/web/lists/getByTitle('" + this.listName + "')/items/",
                type: "GET",
                headers: {
                    "accept": "application/json;odata=verbose",
                },
                success: (data) => {
                    if (callback !== undefined)
                        callback(data.d.results);
                },
                error: (err) => {
                    console.log(JSON.stringify(err));
                }
            });
        }

        getItem(id: number, callback: Function) {
            $.ajax(
                {
                    url: _spPageContextInfo.webServerRelativeUrl +
                        "/_api/web/lists/getByTitle('" + this.listName + "')/items('" + id + "')",
                    type: "GET",
                    headers: {
                        "accept": "application/json;odata=verbose",
                    },
                    success: (data) => {
                        if (callback !== undefined)
                            callback(data.d);
                    },
                    error: (err) => {
                        console.log(JSON.stringify(err));
                    }
                }
            );
        }

        updateItem(id: number, data: any, callback: Function) {
            $.ajax(
                {
                    url: _spPageContextInfo.webServerRelativeUrl +
                        "/_api/web/lists/getByTitle('" + this.listName + "')/items('" + id + "')",
                    type: "POST",
                    contentType: "application/json;odata=verbose",
                    data: data,
                    headers: {
                        "accept": "application/json;odata=verbose",
                        "X-RequestDigest": $("#__REQUESTDIGEST").val(),
                        "IF-MATCH": "*",
                        "X-Http-Method": "PATCH"
                    },
                    success: () => {
                        if (callback !== undefined)
                            callback();
                    },
                    error: (err) => {
                        console.log(JSON.stringify(err));
                    }
                }
            );
        }

        removeItem(id: number, callback: Function) {
            $.ajax(
                {
                    url: _spPageContextInfo.webServerRelativeUrl +
                        "/_api/web/lists/getByTitle('" + this.listName + "')/items('" + id + "')",
                    type: "DELETE",
                    headers: {
                        "accept": "application/json;odata=verbose",
                        "X-RequestDigest": $("#__REQUESTDIGEST").val(),
                        "IF-MATCH": "*"
                    },
                    success: () => {
                        if (callback !== undefined)
                            callback();
                    },
                    error: (err) => {
                        console.log(JSON.stringify(err));
                    }
                }
            );
        }
    }
}

All what is left to do in order to retrieve all the items of the Funds list (e.g.) is:

1
2


var fundsDao = new Gobbe.ListDao('Funds');
console.dir(fundsDao.getItems());