Product Administration Guide > Customizable Product Web Templates >

Modifying the Display Name of Items, an Example


You have a customizable product that includes a relationship called Hard Drives. This relationship contains several disk drives. Along with the name of each drive, you want to display a picture of the drive. You want to assign radio buttons as the UI control for selecting the drives.

To prepare for defining the UI Property

  1. Use the Product UI Designer to create the selection pages for configuring the customizable product.
  2. Validate the customizable product, and verify that the pages display correctly.
  3. Create a .gif or .jpg for each hard drive.
  4. Test each file by displaying it in a browser. Use the HTML <img> tag to set the exact size of each image. The <img> tag will be the value you assign to the UI Property variable.

To create a new UI control template and assign it to the Hard Drives relationship

  1. In the Product UI Designer, select the group containing the Hard Drives relationship.
  2. In Group Item List, select the Hard Drives relationship.
  3. Open the Pick UI Style dialog box and write down the name of the radio button template assigned to the relationship.
  4. Open the radio button template and save it to a new file name: eCfgModifiedRadioButton.swt
  5. Open the new template and locate the correct swe.control element.
  6. Set CfgFieldName= ".NewName".

    The first character in the variable name must be a period (.). The variable name must be surrounded by quotes.

  7. Save the file.
  8. In the Product UI Designer Group Item List, select the relationship containing the hard drives.
  9. Open the Pick UI Style dialog box and click Add to add the new template.
  10. Select the new template as the control template for the Hard Drives relationship.

To define a UI property for each of the Hard Drives

  1. Open the User Interface Property Designer and select the first drive in the Hard Drives relationship.
  2. Define a UI property for it as follows:
    • Name. NewName. Do not put a period before the name. This is the variable name you inserted in the template file.
    • Value. Enter the HTML syntax for displaying the drive name and retrieving the image.
  3. Repeat these steps to define a UI property for each hard drive in the relationship.
  4. Open the Item Display Properties menu and click Validate.

    This starts a configuration session. Verify that the item names display correctly.

Product Administration Guide