PnP Dynamic Form Control for SPFx

This control can dynamically generate a SharePoint list or SharePoint document library form and everything is controlled through the list setting. include a default value, mandatory and options. we can build the long-form by just using one line of code

Importing Dynamic Form

import { DynamicForm } from '@pnp/spfx-controls-react/lib/DynamicForm';

Control tag and the attributes

      <div className={styles.spfxPnpDynamicform}>
        <DynamicForm context={this.props.context} listId={"3071c058-549f-461d-9d73-8b9a52049a80"} listItemId={14}
          onBeforeSubmit={(listItemData) => { console.log(listItemData); return listItemData }}
          onSubmitted={async (listItemData) => { console.log(listItemData) }}></DynamicForm>

Download complete project in the blow GitHub link,

If you have any questions, feel free to let me know in the comments section.
Happy coding!!!


Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s