WebPart

Input Parameters

Name Type Description
cfgElementId string The optional configuration element id
className string The class name to apply to the target element.
elementId string The target element id to render the webpart to
editPanel IWebPartEditPanel The edit panel.
helpProps { title?: string, url: string } The optional help link.
onPostRender (wpInfo: IWebPartInfo) The post render event.
onRenderDisplay (wpInfo: IWebPartInfo) The render event triggered when the page is in ‘Display’ mode.
onRenderEdit (wpInfo: IWebPartInfo) The render event triggered when the page is in ‘Edit’ mode.
wpClassName string The class name to apply to the div element containing the webpartid property.

WebPart Edit Panel

Name Type Description
listQuery ODataQuery The OData query to apply to the query for getting the lists.
onListChanged (wpInfo: IWPInfo, list?: IListQueryResult or IListResult) The list changed event.
onListsRendering (wpInfo: IWPInfo, lists?: Array<IListQueryResult or IListResult>) The lists rendering event.
onRenderFooter (el:HTMLDivElement, wpInfo: IWPInfo, list?: IListQueryResult or IListResult) The render footer event.
onRenderHeader (el:HTMLDivElement, wpInfo: IWPInfo, list?: IListQueryResult or IListResult) The render header event.
onSave (wpCfg: IWPCfg) The save event.

JavaScript

var $REST = require("gd-sprest-js");

export const MyWebPart = function(){
    // Create the webpart
    $REST.JS.WebParts.WebPart({
        elementId: "myElementId",
        wpClassName: "fabric",
        onRenderDisplay: function(el, wpInfo) {
            // Render the webpart
            $REST.JS.Fabric.Button({
                el: el,
                text: "My Button",
                onClick: function() {
                    // Code goes here
                }
            });
        }
    });
}

TypeScript

import { Fabric, WebParts } from "gd-sprest-js";

export const MyWebPart = () => {
    // Create the webpart
    WebParts.WebPart({
        elementId: "myElementId",
        wpClassName: "fabric",
        onRenderDisplay: (el, wpInfo) => {
            // Render the webpart
            Fabric.Button({
                el: el,
                text: "My Button",
                onClick: () => {
                    // Code goes here
                }
            });
        }
    });
}