Custom Global CSS & JS

Custom CSS

👉 This CSS will be appended in header so it will be available everywhere.
👉 You can also modify behaviour of existing applied classed in the page.
👉 You can dynamically append these classes to UI elements using custom JS code via different "appendTo".

export interface IDBMasterConfig {
    cssCode: [{
        runOn: 'header',
        code: `
            .font-orange { color: orange; }
        `,
    }],
}

Custom JS

👉 You can add custom JS code using below method and change UI page behaviour as per your business requirement.
👉 Many hooks are available For example.

✓ oncePageLoadWithContext
✓ gridRender
✓ modifyGridRequest
✓ preSaveAndEdit
✓ beforeSaveModalOpen

export interface IDBMasterConfig {
    jsCode: [{
        appendTo: T.EDBMasterConfigAppendTo.oncePageLoadWithContext,
        code: `
            console.log(config);
        `
    }, {
        appendTo: T.EDBMasterConfigAppendTo.gridRender,
        code: `
            // gridEvent, gridData are available to use.

            // Return promise for long awaiting tasks.
            // new Promise(async (resolve, reject) => {
            //     await new Promise(r => setTimeout(r, 3000));
            //     gridData[0].name = 'Mayur';
            //     resolve();
            // });

            // Directly modify data of grid
            // gridData[0].name = 'Mayur';

            // Below is working
            // (function test() { gridData[0].name = 'Mayur'; } );
        `
    }, {
        appendTo: T.EDBMasterConfigAppendTo.modifyGridRequest,
        code: `
            // console.log(moment);
            // console.log(_);
            // gridEvent, reqBody are available to use.

            // reqBody.find.name = 'Jaclyn';
        `
    }, {
        appendTo: T.EDBMasterConfigAppendTo.preSaveAndEdit,
        code: `
            // gridEvent, reqBody are available to use.

            // reqBody.find.name = 'Jaclyn';
            // delete reqBody.name;
            // console.log('from preSaveAndEdit', reqBody);
        `
    }, {
        appendTo: T.EDBMasterConfigAppendTo.beforeSaveModalOpen,
        code: `
            // const field = utils.findFormElement('custom_api_in_dropdown'); // custom_api_in_dropdown = path of field
            const field = utils.findFormElement('10'); // hiddenId field
            console.log(field);

            const allFormFieldsNoGridFields = utils.getFlatArrayOfAllFormFields();
            // console.log(allFormFieldsNoGridFields);

            const allFormFields = utils.getFlatArrayOfAllFormFieldsIncludingGridFields();
            // console.log(allFormFields);
        `
    }],
}