Displaying Images between table line items of an Adobe form table element

[Former Member]

Employee details can be displayed in an adobe form using table element. Suppose if we have to display the image corresponding to each employee, below the line item details of the employee, then follow the below steps:

1. Add an extra image URL column into the internal table with all employee details and fill this column with Image URLs corresponding to each employee record.
2. Current hierarchical structure before adding Image field in adobe form will look like below:

                      MainTable 

                 Header

                 Row1

                      Employee ID

                      Employee Name

                      Employee Age

                      Company code

   3.  Bind the “MainTable” table element with internal table having all employee details in “Binding” tab of “Object” tab.

4. Insert another table element inside MainTable element below the Row1. This can be done by following below steps:
   1. We cannot insert the table element in between table rows. To do this copy any table element in the existing form( use Ctrl+C ). Lets say it as “TableItems”
   2. Select any existing row above which our new row will get added. In our hierarchical structure as shown above, select “Row1” and use Ctrl+V to paste the selected table element(TableItems).
   3. Move the Row1 into this new table element.(Use Ctrl+X and Ctrl+V).
   4. Add another table row “Row2” below “Row1”.
   5. Add image field “Image” attribute into “Row2”.
   6. Bind the “TableItems” with same internal table with employee details.
5. Now the new hierarchical view looks like below:

                        MainTable 

      Header

      TableItems

                Row1

                                     Employee ID

                                     Employee Name

                                     Employee Age

                                     Company code

                            Row2

                                     Image               

6. Adjust the size of the Image field to the size required and add the java script on “TableItems” to fill the image field element with employee image.

             this.Row2.Imgurl.value.image.href = this.Row1.Imgurl.rawValue;

7. When there are no images corresponding to an employee record then to avoid empty space and to hide the image URL column of the table element, add the following java script on “Row2”.

                     if ( this.Imgurl.rawValue == null ) {

        this.presence = "hidden";

        this.Imgurl.presence = "hidden"; }

Regards,

Mahidhar Suggala.