Syncfusion AI Assistant

How can I help you?

Form Designer Toolbar in ASP.NET Core PDF Viewer

28 Feb 20262 minutes to read

The form designer toolbar can be customized by showing or hiding default items and by controlling their order.

Show or hide the form designer toolbar

Toggle the form designer toolbar programmatically during initialization or at runtime.

Use the EnableFormDesigner property or the showFormDesignerToolbar method to change visibility.

The following code snippet shows how to enable the form designer toolbar using the EnableFormDesigner property.

<div style="width:100%;height:600px">
    <ejs-pdfviewer id="pdfviewer"
                   documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
                   enableFormDesigner="true">
    </ejs-pdfviewer>
</div>
<div style="width:100%;height:600px">
    <ejs-pdfviewer id="pdfviewer"
                   serviceUrl='/Index'
                   documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
                   enableFormDesigner="true">
    </ejs-pdfviewer>
</div>

How to customize the form designer toolbar

Choose which tools appear and control their order in the form designer toolbar.

Configure the PdfViewerToolbarSettings with the FormDesignerToolbarItems property to specify which form design tools are available. The property accepts a list of FormDesignerToolbarItem values; included items are displayed and rendered in the order listed while omitted items are hidden. This yields a streamlined form-design experience across devices.

The following example demonstrates how to customize the form designer toolbar by configuring specific tools using FormDesignerToolbarItem.

<div style="width:100%;height:600px">
    <ejs-pdfviewer id="pdfviewer"
                   documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
                   toolbarSettings="@(new Syncfusion.EJ2.PdfViewer.PdfViewerToolbarSettings { FormDesignerToolbarItems = "TextboxTool PasswordTool CheckBoxTool RadioButtonTool DropdownTool ListboxTool DrawSignatureTool DeleteTool" })">
    </ejs-pdfviewer>
</div>
<div style="width:100%;height:600px">
    <ejs-pdfviewer id="pdfviewer"
                   serviceUrl='/Index'
                   documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
                   toolbarSettings="@(new Syncfusion.EJ2.PdfViewer.PdfViewerToolbarSettings { FormDesignerToolbarItems = "TextboxTool PasswordTool CheckBoxTool RadioButtonTool DropdownTool ListboxTool DrawSignatureTool DeleteTool" })">
    </ejs-pdfviewer>
</div>