Implementing a hyperlink in a dojo datagrid

Question

This is my first experience with datagrids, so please forgive everything that is unclear.

I have json text that is implemented in a doag 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, and all the data is displayed as desired, but I would like one of the fields (the "policy" field to be specific) to link to another page. I need to include the information in the "policy" field when redirecting, since the policy number will be used on the next page.

In other words, I want all the policy fields in my table to have their own unique external link, which will contain the policy number from the corresponding field. The easiest way I can do this is to change the layout variable, which is part of the DataGrid structural parameter, but could be simpler. If anyone has any ideas, I would be very grateful.

Thanks in advance.

Answer 1

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

Formatter is a JavaScript function that is called that returns the value that should be displayed in the cell. The value from the data store is passed as a parameter to the function. The return value that is inserted on the page can be any legal HTML or even a digital widget.

So in your case, add formatting to the policy column

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

Then define a function with the necessary external link. For instance:

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

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