Page Comparison

Button Bar enables to add buttons to button bar of the App. Buttons are classified as Positive and Negative buttons and allows users to configure directly under positive and negative tabs.
In the subsequent steps, let's look at the details for configuring buttons to Button Bar:

1. Click the Visibility icon of the Button Bar to enable the visibility of Button Bar as shown in the following screenshot. 
   
   
2. Click Configure Button Bar.
   
   
   
   

3. Provide the Button Bar configurations based on the description provided in the following table:
   
   

   Note
   Configuration descriptions are same for both positive and negative buttons.

   
   

   
   
   

   #	Field Name	Description	Sample Values
   1	Button Display Name	Label key of the localized text, which will appear as button name.	SUBMIT
   2	Button ID	Unique ID for the button.	POSITIVE_ACTION
   3	Product Code	Select the Product Code for the button. Only the users who are authorized to this product can view and use the button in this app. To add new entitlement details, make an entry of the product code (in OD_PRODUCT_CODE column) in OD_PRODUCT_MASTER_MB and OD_FUNCTION_PRODUCT_MAP_MB tables in database.	CUSER
   4	Sub Product Code	Select the Sub Product Code for the Product. Only the users who are authorized to this sub product can view the button in this app. To add new entitlement details, make an entry of the sub product code (in OD_SUBPROD_CODE column) in OD_PRODUCT_MASTER_MB and OD_FUNCTION_PRODUCT_MAP_MB tables in database.	CUSER
   5	Function Code	Name of the Function within the Sub Product for which the button stands for. The users who are authorized only to this function can view the button in this app. To add new entitlement details, make an entry of the function code (in OD_FUNCTION_CODE column) in OD_FUNCTION_MASTER_MB and OD_FUNCTION_PRODUCT_MAP_MB tables in database.	VSBLTY
   6	Label  Image Modified	Indicates the label key of the localized text, which is assigned as the button name.  Selected: The label key will appear. De-Selected: The label key will not appear.	Selected
   7	Icon	This option allows you to choose an icon for the button.  Selected: The icon will appear.  De-Selected: The icon will not appear.  To select an icon for the button, perform the following steps.  1. After entering relevant values for the fields of Button Display Name, Button ID, Product Code, Sub-Product Code and Function Code, proceed to click the option of Icon.  2. The options, Left and Right indicate the position of the icon. On selecting Left, the icon gets placed on the left side of the button, whereas, if Right is chosen, then the icon will get placed on the right side of the button. Select any one of the options.  Image Modified 3. Choose a button style and proceed to click Create.  Image Modified 4. Click the newly created button bar, e.g. SUBMIT.  Image Modified A screen, comprising of various icons appears.  Image Modified 5. Default, Active and Disabled are the three available options, categorized under the field, Choose icons for different state. To find an icon, type the name of the icon in the Search box to find it. You can assign separate icons for the three different states of Default, Active and Disabled. Default indicates the default icon of the button bar, whereas Active and Disabled depict the active and disabled states of the button. When the button is clicked, the chosen icon for Active state gets displayed and similarly, the icon, chosen for Disabled state, gets displayed, if the button is in a disabled state. Image Modified 6. For customized icons, click Custom tab. Image Modified 7. Click Browse Files button to select an image from your local drive. You can even drag and drop the customized image file directly. Image Modified 8. After selecting the image, provide unique names for Class Tag and Search Tag. The Image Name gets assigned automatically. In case, if you wish to change the Image Name, then you can modify it. The name, which you provide in Search Tag, will be detrimental, when you perform a search. Use the name, provided in the Search Tag to find the customized icon. Click Ok to upload the customized icon.  Note If you upload a customized icon for the button bar, ensure that you restart the app server, after saving the app (widget). Make sure to log out from Canvas Studio and close the Studio application, before restarting the app server. If you do not restart the app server, the uploaded custom icon will not appear as the assigned icon for the selected button bar. Image Modified 9. To edit the configurations, associated with the button bar, click Image Modifiedicon, whereas to delete the button bar, click Image Modifiedicon.  Image Modified	Selected
   8	Left - Right	Indicates the position of the icon. If the option Left is selected, the icon will appear on the left side of the button, whereas on selecting Right, the icon will appear on the right side of the button.	Left
   9	Button Styles	Indicates the style of the button.
   10	Create	Click Create to create the button (Positive or Negative).