Jun 02 2008

LiveCycle Designer Advanced: Organizing XML data in multiple columns

Disease:

Let’s say you are a financial organization and you want to inform your customers about the value of their investment over the next 20 or 30 years in a simple one-page overview. When dealing with XML data the Table assistant is often used to make sure that the data rows are displayed in a nice manner. However, when you are dealing with 20 or 30 rows, the table grows bigger, and uses multiple pages. Here is an example of XML data that you might want to display in a consolidated way.

Prescription:

Besides the Table assistant to organize your XML data rows in a nice matter, Adobe LiveCycle Designer offers other features to handle this kind of data, and display it in a different way. Within the Object Library there is an object called “Content Area”, that offers a lot of flexibity to handle the challenge described above. The result of using Content Area’s look like this:

Kolommen in template

A sample document of the result can be downloaded here.

Tip to stay healthy:

I have created a template where I have used the technique above to populate 3 columns with data from an XML file. I have prepared a document package that is downloadable that includes the following documents:

  • LiveCycle Designer template (You need LiveCycle Designer 8.x)
  • 2 XML sample files you can use for previewing (So you can see the different behaviour of the form)

6 responses so far

6 Responses to “LiveCycle Designer Advanced: Organizing XML data in multiple columns”

  1. scott sheckon 18 Jun 2008 at 4:20 pm

    I’m looking at your graph example with contentareas. How are you getting data to show up in the Contentareas? I don’t see any properties or scripts that are performing that.

    thanks very much. Great demo.
    Scott

  2. Marcel van Espenon 18 Jun 2008 at 8:44 pm

    Scott,

    Thanks for your feedback. The script that results in a chart is generated in a field that I put on the master page. There is a hidden field called “testveld”, where I call the script on the initialize event. (CPD.#pageSet[0].Page1.testveld::initialize).
    Check it out, you will see that there is a script that runs through the full table of values, and step by step create a URL that will be the url for the image field “grafiek2″ (grafiek2.value.image.href)

    Hope this helps.

    Greetings,

    Marcel

  3. scott sheckon 18 Jun 2008 at 11:05 pm

    I see that code and see how it generates the graph image, but I don’t see how you are getting the 3 columns of numbers (next to the years) shown in the 3 content areas. I’ve looked everywhere.

  4. Marcel Van Espenon 19 Jun 2008 at 9:55 am

    Ah.. I understand what you are looking for. If you look at the master page there are 3 content areas (contentArea1, contentArea2, contentArea3, in this order). The reason why the data is organized in 3 columns is because on the design page there is a table that starts in contentArea1. If you look at the Object-properties, under the Pagination tab, you will see that there is an entry called “After” and a property “Continue filling parent”.
    If you for instance change the order how the 3 content areas above, are organized on the master page, say contentArea1, contentArea3, contentArea2, you will see that the data from the XML is organized differently.

    So there is no script involved to do this, just a setting and smart use of content areas.

  5. scott sheckon 19 Jun 2008 at 3:01 pm

    But how did get the contents of the XML file to appear in the contentareas in the first place. I can’t find in any of the properties where the XML file is assigned to the contentarea. I’ve never used contentareas and like the idea.

  6. Marcel Van Espenon 25 Jun 2008 at 7:44 am

    Ok, that’s actually quite straigtforward to do, and does not involve any scripts.

    When you create a new form from scratch, start with the master page to make the initial content-area smaller (as in the example), and then add another 2 content area’s.

    Now delete the initial page that was created in the hierarchy, and insert a new page into the form (right click on the root-element of the hierarchy). You will see it automatically will get the size from the first Content Area in the Master Page hierarchy.

    Assuming you already have the data-connection to the sample XML file setup (and the preview data as well), you now go to the Design view and drag “BEDRAG” and “JAAR” to the canvas into the page area. (And remove the caption if applicable)

    Now resize the page-area on the design view to have the same height as the BEDRAG and JAAR fields. (This is just for the appearance)

    Then make sure that on the properties of the page where BEDRAG and JAAR are part of, you check the “repeat Subform for each data entry” property. Leave other properties to default.

    Now this should now work for you. After this, try to re-arrange the Content Areas in the Master Page hierarchy. Notice if you move ContentArea 3 above ContentArea2, the result is also the same. In other words, the form looks at the order of the content areas in the hierarchy.

    Have fun with it.

Trackback URI | Comments RSS

Leave a Reply