How to Create a Crud Form Widget Using the New Widget Builder

Background information

The new Widget Builder integrates all widget configuration options on a single page.

• By centralizing the management of all configuration options, users no longer need to switch between various pages, saving time and effort, enhancing user experience, improving work efficiency, and simplifying the operation process.
• This integrated design is easy to use and makes the configuration process more intuitive and efficient.  

When to use the Crud Form widget 

The Crud Form widget allows users to create, read, update, and delete the widget data on the dashboard. It helps streamline the data management process, ensuring that information is accurately recorded, easily accessible, and efficiently updated or removed as needed. Some examples of data that fit into the Crud Form widget type are:   

• Client information. View client profiles, edit the details of existing clients, and add or remove new clients.  
• Service Tickets. Monitor tickets and their statuses, log new or close resolved tickets, and update ticket details, status, priority, and resolution notes. 
• Contracts and Agreements. Access and review contracts, enter new service contracts and agreements, terminate or void contracts as needed, and amend contract terms, renewals, or adjustments.

• Billing and Invoicing. Review historical billing data, generate new invoices and billing records, correct errors or remove old billing records, and adjust invoice details, payment statuses, and billing cycles. 

Required permissions

Only users with admin roles can access the New Widget Builder and edit the widget settings. 

Creating the Crud Form widget 

1. Select the widget type and enable the New Widget Builder option

1. Go to Widgets on the MSPbots app, click the New Widget button, and select the Crud Form widget type. 
   
   
   
   
2. When the Widget Builder window opens, click the +Dataset button. 
   
   
   
   To switch back to the old Widget Builder, follow the steps for Switching back to the previous Widget Builder. 
   
   
3. When the Select Dataset window appears, select an Integration from the Integration Group list.
   
   
   *The selected integration is for illustration only. 
   
   
4. Select the appropriate source dataset from the Dataset List and click Add Selected. 
   
   
   *The selected dataset is for illustration only.
   
   
5. Next, select the appropriate fields from the Dataset section and drag them to Column under the Drill Through section. Review the Field name, Alias, and Format, then click Save.
   
   
   
   *The selected field for the drill-through is for illustration only. 
   
   
6. To refine the data, add a filter by clicking +Click to Add under the Filter section.
   
   When the Filter window appears, choose the operator AND or OR, then select a filter from the first dropdown list and the corresponding options from the next two columns. 
   
   
   
   
   You can click the add button to add more filters or the delete icon to remove rows. 
   
   
   
   
7. Click Save. 
   
   You can add more configurations to your Crud Form widget to meet your reporting requirements. For more configuration options, see the section on Other configuration options. 
   
   
8. Set the Crud Form's configurations and go to Options in the rightmost column. 
   
   
   
   
9. Set the following configuration options:
   1. Toolbar - Show any of the following functions in the widget by turning the corresponding switches ON: 
      • Show Search - Turn this switch ON to show the search bar. 
        
        
        
        
      • Show Delete - When enabled, this switch displays the Delete button.  
        
        
        
        
      • Show Share - Enable this switch to show the Share button.
        • Click    to share the configured form list, see Sharing the Form List for more detailed information.
        • Before sharing, ensure the Form List option is configured in the Body section.
        • The switch is disabled by default.
        • The Show Share button will be hidden in the following scenarios:
          • TV mode
          • Presentation mode
          • Public share links
            
            
            
            
      • Show Toolbar - Enable this switch to display the toolbar area containing PDF Export, CSV Export, and Columns filter.
        
        
        
        
      • CSV - Enable this switch to show the CSV Export button and allow export. 
      • PDF - Enable this switch to show the PDF Export button and allow export. 
      • Export Option – Enable this switch to configure export settings when clicking the PDF Export or CSV Export.
         
        
        
        
      • Column Chooser - Activate this switch to display the Column filter in the widget. 
        
        
        
        
   2. Body - Configure this section to customize how the widget's content will be displayed. 
      • Form List 
      • Form Data 
      • Show Line Numbers - Turn this switch ON to show the numbering for every row in the form. 
        
        
        
        
      • Show Selection - Turn this switch ON to show the selection box for each row in the form. 
        
        
        
        
   3. Footer - Pagination - Activate the Pagination switch to display the page numbers in the footer. 
   4. Customization - This section shows the columns you selected in the Drill Through. If you want to configure the columns, see Customizing Column.
   5. Conditional Formatting - This section shows the conditions you created. 

2. Save the widget settings. 

1. Click Save in the upper-right corner.
   
   
    

2. When Apply Success appears, it means the save is successful.
   
   
    

   New widgets are at the bottom of dashboards, scorecards, and reports. When you save a new widget, the screen will automatically scroll to show the new widget.
   You can edit the dashboard design by modifying the widget's placement in the dashboard.

What other actions are available from the widget's screen in the new Widget Builder?

Customizing Column

Configure the columns you selected in the Drill Through. 



 
 

Editing a column

1. Click Customization bar to show the settings.
2. Click    to edit a column.
3. Configure the following options.
   
   
    
   • Header Title - Assign a column name.
   • Tooltips - Add a tooltip for the column.
   • Text Align - Set alignment to Left, Center, or Right.
   • Allow Filter - Toggle to allow users to filter the column.
   • Disable HTML - Turn on the Disable HTML toggle switch to disable the use of HTML codes. This toggle switch is enabled by default.
     • When the Disable HTML switch is turned on, if the field's content exceeds 300 characters (including spaces and punctuation), the text will be trimmed to 300 characters. To see the complete content of the field, hover over the field in the widget, and a tooltip will appear to display the full content.
       
       
        
       • If you encounter excessive content in the field or if your HTML codes are not working properly, please turn on the Disable HTML switch to ensure it functions correctly and to avoid performance issues that may cause PDF generation to fail.
     • When the Disable HTML switch is turned off, there are no restrictions on the character count of the field content, but excessive characters may lead to performance issues.
   • Max Width - Set the width for the column.
   • (Optional) Aggregates - When the column type is Number, calculate the values in the column. The calculation result is displayed at the bottom of the widget.
     1. Click + Add button.
     2. Choose one of the following calculation methods:
        • Sum - Calculates the sum value.
        • Min - Finds the minimum value.
        • Max - Finds the maximum value.
        • Count - Counts the number of items.
          
          
           
        • Average - Calculates the average value.
          • When you select Average as the Aggregates, you can customize the precision of the Number Format. There are five options for precision: 0, 0.0, 0.00, 0.000, 0.0000.
            
            
             
4. Click Save.

Hiding a column

• Click button to hide a column.
  
  
   
• If you want to display the hidden column, click button to show it.
  
  
   

Adjusting the column order

You can adjust the order of the columns by dragging and dropping, and the changes will be applied to the widget immediately.


 

Switching back to the old Widget Builder

If you want to switch back to the original Widget Builder page, click    to open the Unsaved Changes pop-up window.

• If you do not want to save the settings in the New Widget Builder, click Leave without Saving.
• If you want to save the settings in the New Widget Builder, click Save Changes. 
  
  
   

If you have clicked Save to keep the settings in the New Widget Builder, clicking        will directly switch to the original Widget Builder.

Creating a bot from the widget

1. Click   > Create Bot.
   
    
    
2. For more details on creating a bot, see How to Create a Bot from a Widget in New Widget Builder mode.

Creating a filter for the widget

The filter is for secondary filtering of the data filtered in the Dataset.

1. Click   > Filter.
   
    
    
2. Select a field you want to filter.
   
   
    
3. Set a condition for the field using the subsequent two dropdowns. For descriptions of each option, refer to What Filter Conditions and Formats are Available for Creating Widgets.
4. If you want to add multiple filter conditions,
   1. Click the Add icon and choose either Add Condition or Add Group.
      • Add Condition - Add a filter condition.
      • Add Group - Add a condition group.
        
        
         
   2. Repeat steps 2 and 3.
5. Select the logical operator AND or OR for the conditions or filter groups.
   • AND - Conditions within a group or groups are connected by an AND relationship, which requires that all conditions or groups must be fulfilled.
   • OR - Conditions within a group or groups are connected by an OR relationship, which means that only one of the conditions or groups needs to be fulfilled.
6. Click ok to keep your settings.
   
   
    

Cloning the widget 

1. Click the    button in the upper-right corner.
2. Hover over Clone to and select from:
   • Clone to "My Widgets"
   • Clone to Existing Dashboard
   • Clone to New Dashboard
     
      
      
3. Follow the steps below:
   • If you select Clone to "My Widgets",
     1. Fill in the following fields:
        • Name
        • Role
        • Description
          
          
           
     2. Click Confirm to clone the widget as a new widget.
   • If you select Clone to Existing Dashboard,
     1. Select a existing dashabord from the list.
        
        
         
     2. Click Clone.
     3. The page will redirect to the editing mode of the existing dashboard. For more information on how to edit the dashboard, see How to Create and Use Dashboards in MSPbots. 
        You can also find the cloned widget in My Widgets category in Widgets.
   • If you select Clone to New Dashboard,
     1. Select Dashboard or Report.
        
        
         
     2. For more information on how to edit the dashboard or report, refer to the below articles.
        • How to Create and Use Dashboards in MSPbots
        • How to Create and Use Reports in MSPbots 
          You can also find the cloned widget in My Widgets category in Widgets.

Sharing the widget 

1. Click the Share icon to copy the URL of the widget.
   
   
    
2. The message Copy Success indicates that the copy was successful and you can share the URL with others who want to view the widget.
   
   

Deleting the widget 

1. Click the    button, and then select Delete.
   
    
    
2. Click Confirm.
   
   

Editing the basic settings of the widget

1. Click the    button next to the widget name to edit the basic settings of the widget.
   
   
    
2. Fill in the following fields.
   • Name
   • Description
   • More Info
   • Tag
   • Role
     
     
      
3. Click Save.
4. When Apply Success appears, it means the save is successful.
   
   

Adding the widget to My Favorites

Click the   button in the upper-right corner to add the widget to My Favorites.


 

• When   changes to  , it means the addition was successful.
• After that, you can find the widget in the My Favorites tab.
  
  
   
• If you want to remove it from My Favorites, click   to change it to  .
  
  
   

Refreshing the widget preview panel

Click Refresh to manually refresh the widget preview panel.


 

For the Auto Refresh checkbox,

• The Auto Refresh checkbox is selected by default.
• When the Auto Refresh checkbox is selected, the widget preview panel automatically refreshes whenever you modify the widget's configuration.
• When you clear the Auto Refresh checkbox, the widget preview panel stops refreshing automatically and refreshes only when you manually click Refresh.
• Your setting for the Auto Refresh checkbox applies to all widgets.
   
  
   

Sharing the Form List

1. Click    to open the Share popup.
   
   
   
   
2. Set a Time Limit.
   • Select No Time Limit if the link will be available without limits
   • Select Customized Time to specify a time limit for the link's availability.
3. For User Access,
   
   • Select Everyone
   • Select Selected Users to specify accessible users.
4. Click Generate. A sharable link appears in the URL field.
   
   
   
   
5. Click Copy to copy the URL for sharing. You may now share the link via email or any channel.
   
   
   
   
   • Use the URL to view the configured form list. Press F11 to enter the full-screen mode, and press Esc to exit the full-screen mode.
   • If you want to modify the availability time of an existing shareable link, generate a new shareable link, or revoke the existing shareable link, follow the steps below to revoke the existing link.
     1. Click Revoke.
        
        
        
        
     2. Click Confirm. The old sharable link is revoked and cannot be accessed anymore.
        
        
        
        

Other configuration options 

1. Data Scope

This option is editable if the dataset has multiple layers. If the dataset has only one layer, skip this option and proceed to the next step. 

For datasets with multiple layers, select the layer you want to configure.


 

How to check the number of layers in the dataset you are configuring?

1. Search for the dataset you are configuring, and click it to open. For example, search ConnectWise Manage Time Entry - Layered dataset.
   
   
    
2. Click  .
   
   
    
3. Click the Please Select Layer dropdown list to see how many layers there are.
   
   
    

2. Field Chooser

1. Click the Field Chooser bar to show the settings.
   
   
    
2. Field - Configure which fields are included in the widget.
   1. Drag the required fields from the Dataset column to the Field section.
      Note: Ensure that all required fields from the Dataset column are dragged to the Field section. The fields available in Query will be the fields dragged to the Field section.
   2. Click    to configure the following fields:
      • Field - Select a field from the dropdown.
      • Alias - Type an Alias.
      • Formula - Enter SQL to create a calculated value by using basic mathematical
        operations on the dataset fields and any number.
      • Format Type - Select a Format Type. For more detailed information, see Conditions and Formats Available for Creating Widgets.
        • Text
        • Number
        • Date
        • Date Time
        • Yes/No
        • User
        • Hyperlinks
      • Display Type - Select a Display Type. For more detailed information, see Conditions and Formats Available for Creating Widgets.
   3. Click Save.
      
      
       
   4. (Optional) When you set up Measure, click    or    to configure whether the fields in the Field Chooser are displayed in the Drill Through of the Measure, aside from the fields that are set as Measure.
      
      
       
3. Order By - Sort the data from drilling through a specific dataset based on the selected fields and sorting rules.
   1. Click    to add a field.
   2. Fill in the following fields:
      • Field
      • (Optional) Order By
        • Ascending
        • Descending
   3. Click Save.
      
      
       

3. Query

1. Click the Query bar to show the settings.
2. For Measure - Configure the fields to be calculated and the formula for calculating measures.
   1. Click  .
   2. Click    to configure the following fields:
      1. Field Name - Select a field from the dropdown.
      2. Alias - Type an Alias for the measure.
      3. Formula - Enter SQL to create a calculated value by using basic mathematical
         operations on the dataset fields and any number.
      4. Summarize Type - Select a Summary Type.
         • sum
         • count
         • Average
         • Maximum
         • Minimum
         • String_Aggregate
      5. Format Type - Select a Format Type. For more detailed information, see Conditions and Formats Available for Creating Widgets.
         • Text
         • Number
         • Date
         • Date Time
         • Yes/No
         • User
      6. Display Type - Select a Display Type. For more detailed information, see Conditions and Formats Available for Creating Widgets.
      7. Remove duplicate data - If you want to remove duplicate data when calculating data, please check this option.
   3. Click Save.
      
      
       
3. For Dimension - Configure the fields and format you want to be displayed as a group.
   1. Click  .
   2. Click    to configure the following fields:
      
      
       
      1. Field Name - Select a field from the dropdown.
      2. Alias -Give an Alias for the dimension.
      3. Format Type - Select a Format Type. For more detailed information, see Conditions and Formats Available for Creating Widgets.
         • Text
         • Number
         • Date
         • Date Time
         • Yes/No
         • User
         • Hyperlinks
      4. Display Type - Select a Display Type. For more detailed information, see Conditions and Formats Available for Creating Widgets.
   3. Click Save.
4. For Filter - Add conditions for filtering data.
   1. Click   .
   2. Select a field you want to filter.
   3. Set a condition for the field using the subsequent two dropdowns.
      For a guide on each option on the list, refer to the article Conditions and Formats Available for Creating Widgets.
      
      
       
      1. If you want to add multiple conditions, click + Condition to add.
         
         
          
         • Select the logical operator AND or OR for the filter conditions.
           
           
            
      2. If you want to add multiple groups, click + Group to add.
         
         
          
         • Select the logical operator AND or OR for the filter groups.
           
           
            
   4. (Optional) If you want to set advanced settings, click   .
      • Case SenSitive - If you want the condition to be case-sensitive when filtering the fields, please turn on the Case SenSitive switch.
        
        
         
      • Slicer
        1. If you want to add a slicer for a condition, turn on the Slicer switch.
           
           
            
        2. Click Select Slicer, then select a slicer from the dropdown list.
           
           
            
           • Ignore Filter - When the Ignore Filter option is checked, the value of the condition will be grayed out. Once checked, you only need to fill in the field and query string. And only the slicer will be effective.
             
             
              
   5. (Optional) SQL Preview - Click SQL Preview to check the filter settings by viewing the Filter Expression and Filter SQL.
      
      
      
      
       
   6. Click Save.
      
      
       
5. For Order By - Sort the data of a specific layer in a certain dataset based on the selected fields and sorting rules.
   1. Click  .
   2. Configure the following fields:
      • Field - Select a parameter to sort the data.
      • Order By
        • Ascending
        • Descending
   3. Click Save. 
      
      
       
6. Row Limit - Select an option to limit the data rows for a specific layer in a certain dataset.
   
   
    
7. Remove duplicate data - If you want to remove duplicate data, select this option.
   
   
    
8. Materialized - Select an option from the Materialized dropdown menu to materialize data based on the actual conditions.
   
   
    

4. Clear Query

When you want to clear all fields in Query and Drill Through at once, you can click Clear Query to avoid deleting them individually.

1. Click Clear Query at the bottom of the page.
   
   
    
2. Click Continue.
   
   
    

5. Dataset

• Search fields - Use keywords to search for the fields you need.
  
  
   
• Order By - Sort all data from the added datasets based on the selected fields and sorting rules. 
  
  
   
  1. Fill in the Field and Order By rules.
     
     
      
  2. Click Save.
     
      
• Row Limit - Select an option to limit the rows of data for all added datasets.
  
  
   

• Replace the dataset with another one you want.

  1. Hover over the name of the dataset.
  2. Click the ellipsis    button, then select Select.
     
     
      
  3. Click your desired dataset and click Add Selected.
     Replace the dataset with one that matches the structure of the original dataset. For example, a dataset that only differs in field data values is essential to avoid error reports and widget malfunctions.
     
      

   

• Rename, Clone, or Delete the dataset
  1. Hover over the name of the dataset.
  2. Click the ellipsis    button, then select Rename/Clone/Delete.
     
     
      
     • When you hover over the dataset, it displays the original name of the dataset. 
       
       
        
     • If you have renamed the dataset, hovering over it displays both the original name and the name you renamed it to.
       
       
        

   *   If you want to add a Calculate Layer, refer to Adding a Calculate Layer to a Widget.
   *   When you add a dataset with fields next to the triangle icon, it indicates that the field is associated with other datasets. 
   *   The fields in the associated datasets can be dragged or added to the widget configuration area for settings. 
   *   If you configure fields from the associated dataset in Query, Drill Through, or Options, the Widget Builder mode will stay in the New Widget Builder mode and cannot switch back to the original mode. You can switch back to the original mode only after you clear the fields from the associated dataset.