Implementing a hyperlink within a dojo datagrid

Question

This is my first time working with datagrids so please forgive anything that is unclear.

I have json text that is being implemented in a dojo datagrid (dojox.grid.DataGrid).

  var jsonStore = new dojo.data.ItemFileWriteStore({ url: "xAgent.xsp"});
  var layout = [
    {cells:[ [ 
      {field:'firstname', name:'First'}, 
      {field:'lastname', name:'Last'},
      {field:'policy', name:'Policy'},
      {field:'lastaccessed', name:'Last Accessed'}
      ] ], noscroll:false
    }
  ];

  grid = new dojox.grid.DataGrid({
    store: jsonStore,
    structure: layout,
    rowsPerPage: 50,
    autoHeight: 50
  }, '#{id:gridNode}');
grid.startup();

The grid itself is created perfectly fine and all data is displayed as desired, but I would like for one of the fields (the 'policy' field to be specific) to link towards another page. I need to include the information within the 'policy' field when I redirect as the policy number will be used in the next page.

In other words, I want all of the policy fields within my table to have their own unique external link that will contain the policy number from that respective field. The easiest way I can think of doing that is by changing the layout variable that feeds into the DataGrid's structure parameter, but there might be an easier way. If anyone has any ideas I would be very grateful.

Thanks in advance.

I am nearly positive that this can be done. You can create a onclick event for the grid, and have access to data from the current row. Look here http://xcellerant.net/ and I think you find that Brad has a post on that. I have used it myself. — Steve Zavocki, Jun 13 '14 at 21:09

score 4 · Accepted Answer · answered Jun 14 '14 at 05:58

4

You can use formatter to create links, dojo buttons etc inside the grid.

Formatter is a JavaScript function that is called which returns the value to be shown in the cell. The value from the data store is passed as a parameter to the function. The returned value that is inserted into the page can be any legal HTML or even a dijit widget.

So in your case, add a formatter to policy column

{field:'policy', name:'Policy', formatter: createLink},

Then define the function with necessary external link. For example:

function createLink(data){
    return ("<a href=policyinfo.jsp?policy="+data+">"+data+"</a>");
}

Reference: http://dojotoolkit.org/reference-guide/1.10/dojox/grid/DataGrid.html#id3

answered Jun 14 '14 at 05:58

robin

186
4

Thank you very much for your response. Is there a way to reference the value that "field" will specify? My jsonStore includes something akin to "policy":"0101" and so using your method I would need to somehow get the information from the field "policy" to the function createLink. I like this idea, but again I'm faced with the issue that I do not see how I can reference the field. If this was as simple as saying "formatter: createLink(field.getValue())" then it would be perfect. Do you know of a way to do this? – cards Jun 15 '14 at 03:55
2

@user3739102 Yes. The value from the date store is passed as a parameter to the formatter function. In the example it is `data`. There is no need to specify the parameter in layout. It will be passed implicitly(?). – robin Jun 15 '14 at 04:11

Implementing a hyperlink within a dojo datagrid

1 Answers1

Linked