You are here: 1 – Setup > 1.4 Viewpoint customization > Customizing Viewpoint with the DataviewConfig.groovy file > Customizing the view elements

Customizing the view elements

The view element of the DataviewConfig.groovy file determines the much of the look-and-feel of the item list on the DataView page. For each column, you can specify:

Changing the column order

Columns appear on DataView pages in the order they appear in the DataviewConfig.groovy file. If you want to re-order the columns on the DataView page, simply change the order in the DataviewConfig.groovy file.

To change the column order

  1. Open the DataviewConfig.groovy file in the $VIEWPOINT_HOME directory, and find the ID of the page you want to modify (for example, if you want to modify the Node Management page, find the nodes section).
  2. Locate the "view" element.
  3. nodes = """{
    "sort" : {"${DV_SORT_SORT}":[{"name":"ASC"}]},
    "page" : {"${DV_PAGE_NUMBER}":0, "${DV_PAGE_COUNT}":20},
    "filter" : "{}",
    "data" : {
        "view":[
          {"${DV_ID_KEY}": "name",            "${DV_TITLE_KEY}": "Name",     "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"},
          {"${DV_ID_KEY}": "state",           "${DV_TITLE_KEY}": "Status",   "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}", "${DV_DBKEY_KEY}": "states.state"},
          {"${DV_ID_KEY}": "power",           "${DV_TITLE_KEY}": "Power",    "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}", "${DV_DBKEY_KEY}": "states.powerState"},
          {"${DV_ID_KEY}": "os",              "${DV_TITLE_KEY}": "OS",       "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}", "${DV_DBKEY_KEY}": "operatingSystem.image", "${DV_WIDTH_KEY}": 100},
          {"${DV_ID_KEY}": "totalMemory",     "${DV_TITLE_KEY}": "Memory",   "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 0,  "${DV_TYPE_KEY}": "${DV_LONG_TYPE}",   "${DV_DBKEY_KEY}": "resources.memory.configured"},
          {"${DV_ID_KEY}": "totalProcessors", "${DV_TITLE_KEY}": "Procs",    "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 0,  "${DV_TYPE_KEY}": "${DV_LONG_TYPE}",   "${DV_DBKEY_KEY}": "resources.processors.configured"},
          {"${DV_ID_KEY}": "images",          "${DV_TITLE_KEY}": "Images",   "${DV_VISIBLE_KEY}": 0,  "${DV_SORTABLE_KEY}": 0, "${DV_FILTERABLE_KEY}": 0,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"}
        ]}
    }"""

    Note the order of the columns. This is the order in which the columns will appear (left-to-right) on the Node Management page.

  4. Now say, for example, that you want to change the order so that the "Power" column appears before the "Status" column. You would make the following change in the DataviewConfig.groovy file:
  5. ...
    "data" : {
        "view":[
           {"${DV_ID_KEY}": "name",            "${DV_TITLE_KEY}": "Name",     "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"},
           {"${DV_ID_KEY}": "power",           "${DV_TITLE_KEY}": "Power",    "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}", "${DV_DBKEY_KEY}": "states.powerState"},
           {"${DV_ID_KEY}": "state",           "${DV_TITLE_KEY}": "Status",   "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}", "${DV_DBKEY_KEY}": "states.state"},
           {"${DV_ID_KEY}": "os",              "${DV_TITLE_KEY}": "OS",       "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}", "${DV_DBKEY_KEY}": "operatingSystem.image", "${DV_WIDTH_KEY}": 100},
           {"${DV_ID_KEY}": "totalMemory",     "${DV_TITLE_KEY}": "Memory",   "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 0,  "${DV_TYPE_KEY}": "${DV_LONG_TYPE}",   "${DV_DBKEY_KEY}": "resources.memory.configured"},
           {"${DV_ID_KEY}": "totalProcessors", "${DV_TITLE_KEY}": "Procs",    "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 0,  "${DV_TYPE_KEY}": "${DV_LONG_TYPE}",   "${DV_DBKEY_KEY}": "resources.processors.configured"},
           {"${DV_ID_KEY}": "images",          "${DV_TITLE_KEY}": "Images",   "${DV_VISIBLE_KEY}": 0,  "${DV_SORTABLE_KEY}": 0, "${DV_FILTERABLE_KEY}": 0,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"}
        ]}
    ...
  6. Save your changes to the DataviewConfig.groovy file.
  7. Go to the Configuration Home page in Viewpoint, and verify that your JSON syntax is still correctly validated. For more information, see Fields: Configuration Home.

Your changes should update automatically. However, if you see that your changes have not taken effect, it is recommended that you restart Tomcat.

Re-labeling column headings

Columns are labeled a certain way by default in the DataviewConfig.groovy file. If you want to change the column heading label, you can modify the "${DV_TITLE_KEY}" value for the column you want to customize.

To re-label a column heading

  1. Open the DataviewConfig.groovy file in the $VIEWPOINT_HOME directory, and find the ID of the page you want to modify (for example, if you want to modify the Node Management page, find the nodes section).
  2. Locate the "view" element.
  3. nodes = """{
    "sort" : {"${DV_SORT_SORT}":[{"name":"ASC"}]},
    "page" : {"${DV_PAGE_NUMBER}":0, "${DV_PAGE_COUNT}":20},
    "filter" : "{}",
    "data" : {
        "view":[
    ...
  4. For the column you want to re-label, modify the "${DV_TITLE_KEY}" value to the new label you want to use. For example, if you want to re-label the default "Name" column of the Node Management page to "ID," make the following modification in the DataviewConfig.groovy file:
  5. ...
    "data" : {
        "view":[
          {"${DV_ID_KEY}": "name",            "${DV_TITLE_KEY}": "ID",     "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"},
    ...
  6. Save your changes to the DataviewConfig.groovy file.
  7. Go to the Configuration Home page in Viewpoint, and verify that your JSON syntax is still correctly validated. For more information, see Fields: Configuration Home.

Your changes should update automatically. However, if you see that your changes have not taken effect, it is recommended that you restart Tomcat.

Hiding columns

You can configure which columns in a DataView page are visible by modifying the "${DV_VISIBLE_KEY}" value for the column you want to hide or show. The value for this element is either 1 for true (visible) or 0 for false (hidden).

To hide or show a column

  1. Open the DataviewConfig.groovy file in the $VIEWPOINT_HOME directory, and find the ID of the page you want to modify (for example, if you want to modify the Node Management page, find the nodes section).
  2. Locate the "view" element.
  3. nodes = """{
    "sort" : {"${DV_SORT_SORT}":[{"name":"ASC"}]},
    "page" : {"${DV_PAGE_NUMBER}":0, "${DV_PAGE_COUNT}":20},
    "filter" : "{}",
    "data" : {
        "view":[
    ...
  4. For the column you want to hide or show, modify the "${DV_VISIBLE_KEY}" value to either 1 for true (visible) or 0 for false (hidden). For example, if you want to hide the "Name" column of the Node Management page, make the following modification in the DataviewConfig.groovy file:
  5. ...
    "data" : {
        "view":[
          {"${DV_ID_KEY}": "name",            "${DV_TITLE_KEY}": "Name",     "${DV_VISIBLE_KEY}": 0,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"},
    ...
  6. Save your changes to the DataviewConfig.groovy file.
  7. Go to the Configuration Home page in Viewpoint, and verify that your JSON syntax is still correctly validated. For more information, see Fields: Configuration Home.

Your changes should update automatically. However, if you see that your changes have not taken effect, it is recommended that you restart Tomcat.

Making columns sortable

You can configure which columns in a DataView page are sortable by modifying the "${DV_SORTABLE_KEY}" value for the column you want to customize. The value for this element is either 1 for true (sortable) or 0 for false (not sortable).

To make a column sortable

  1. Open the DataviewConfig.groovy file in the $VIEWPOINT_HOME directory, and find the ID of the page you want to modify (for example, if you want to modify the Node Management page, find the nodes section).
  2. Locate the "view" element.
  3. nodes = """{
    "sort" : {"${DV_SORT_SORT}":[{"name":"ASC"}]},
    "page" : {"${DV_PAGE_NUMBER}":0, "${DV_PAGE_COUNT}":20},
    "filter" : "{}",
    "data" : {
        "view":[
    ...
  4. For the column you want to customize, modify the "${DV_SORTABLE_KEY}" value to either 1 for true (sortable) or 0 for false (not sortable). For example, if you want to make the "Name" column of the Node Management page unsortable for users, make the following modification in the DataviewConfig.groovy file:
  5. ...
    "data" : {
        "view":[
          {"${DV_ID_KEY}": "name",            "${DV_TITLE_KEY}": "Name",     "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 0, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"},
    ...
  6. Save your changes to the DataviewConfig.groovy file.
  7. Go to the Configuration Home page in Viewpoint, and verify that your JSON syntax is still correctly validated. For more information, see Fields: Configuration Home.

Your changes should update automatically. However, if you see that your changes have not taken effect, it is recommended that you restart Tomcat.

Making columns filterable

You can configure which columns in a DataView page are filterable by modifying the "${DV_FILTERABLE_KEY}" value for the column you want to customize. The value for this element is either 1 for filterable or 0 for not filterable.

To make a column filterable

  1. Open the DataviewConfig.groovy file in the $VIEWPOINT_HOME directory, and find the ID of the page you want to modify (for example, if you want to modify the Node Management page, find the nodes section).
  2. Locate the "view" element.
  3. nodes = """{
    "sort" : {"${DV_SORT_SORT}":[{"name":"ASC"}]},
    "page" : {"${DV_PAGE_NUMBER}":0, "${DV_PAGE_COUNT}":20},
    "filter" : "{}",
    "data" : {
        "view":[
    ...
  4. For the column you want to customize, modify the "${DV_FILTERABLE_KEY}" value to either 1 for filterable or 0 for not filterable. For example, if you want to make the "Name" column of the Node Management page unfilterable for users, make the following modification in the DataviewConfig.groovy file:
  5. ...
    "data" : {
        "view":[
          {"${DV_ID_KEY}": "name",            "${DV_TITLE_KEY}": "Name",     "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 0,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"},
    ...
  6. Save your changes to the DataviewConfig.groovy file.
  7. Go to the Configuration Home page in Viewpoint, and verify that your JSON syntax is still correctly validated. For more information, see Fields: Configuration Home.

Your changes should update automatically. However, if you see that your changes have not taken effect, it is recommended that you restart Tomcat.

Changing column widths

Column widths are controlled in the DataviewConfig.groovy file. If you want to change the width for a certain column, you can modify (or add) the "${DV_WIDTH_KEY}" value for the column you want to resize.

To change a column's width

  1. Open the DataviewConfig.groovy file in the $VIEWPOINT_HOME directory, and find the ID of the page you want to modify (for example, if you want to modify the Node Management page, find the nodes section).
  2. Locate the "view" element.
  3. nodes = """{
    "sort" : {"${DV_SORT_SORT}":[{"name":"ASC"}]},
    "page" : {"${DV_PAGE_NUMBER}":0, "${DV_PAGE_COUNT}":20},
    "filter" : "{}",
    "data" : {
        "view":[
    ...
  4. For the column you want to resize, modify (or add, if it is not already present) the "${DV_WIDTH_KEY}" value with a new width (number) in pixels. For example, if you want to make the "Name" column a little wider (50 pixels, for example), make the following modification in the DataviewConfig.groovy file:
  5. ...
    "data" : {
        "view":[
          {"${DV_ID_KEY}": "name",            "${DV_TITLE_KEY}": "Name",     "${DV_VISIBLE_KEY}": 1,  "${DV_SORTABLE_KEY}": 1, "${DV_FILTERABLE_KEY}": 1,  "${DV_TYPE_KEY}": "${DV_STRING_TYPE}"}, "${DV_WIDTH_KEY}": 50},
    }...

    You should only modify column widths for columns you think might need to be wider. It is also recommended that you leave at least one column with the width unset so that the table can resize properly as the browser window resizes.

  6. Save your changes to the DataviewConfig.groovy file.
  7. Go to the Configuration Home page in Viewpoint, and verify that your JSON syntax is still correctly validated. For more information, see Fields: Configuration Home.

Your changes should update automatically. However, if you see that your changes have not taken effect, it is recommended that you restart Tomcat.

Related topics 

© 2015 Adaptive Computing