Passing HTML through JSON (PHP and DOJO)

I have a datastore that is querying a data开发者_运维问答base and outputting JSon... something like this:

$data[] = array('id' => $i, 'prod_id' => $product_id, 'link' => $link);

I'm wondering how you can pass back a link using the $link variable. If I had this for example:

$link = "<a href=\"google.com\"> Clicky </a>";

The datagrid would display Clicky and not the actual html link... Is there anyway to pass back html?

I would suggest passing the link URL and the link text separately, then reconstructing them into an anchor link in JavaScript on the client-side.

You could also try escaping the HTML, then unescaping on the client-side.

I have no idea why it won't send links- perhaps the browser is trying to parse the sent HTML too early?

You can use formatter in dojo grid to format the HTML displayed in each cell. When creating the grid, you can set a formatter for each column. The formatter is a JavaScript function that takes two parameters, the first one value means the value of the cell, the second one rowIndex means the index of current row. The return value of the formatter function is the HTML content displayed in the cell.

For your case, I would suggest that you use a single column for both the link URL and anchor text. You can use a simple encoding, like http://www.google.com$$$Clicky, where $$$ is used to separate these two fields. The PHP code would be:

$link = "http://www.google.com$$$Clicky";

Then in your formatter function, you can use :

function(value, rowIndex) {
    var parts = value.split('$$$');
    return "<a href='" + parts[0] + "'>" + parts[1] + "</a>";
} 

If you prefer to use one column for each field, e.g. url for URL and anchorText for the anchor text. Then you need to get the value of another column when formatting the cell. Suppose the grid uses the url field. Then the formatter function may look like below:

function(value, rowIndex) {
   var item = grid.getItem(rowIndex); // Get the store item by index, need the reference of the grid.
   var anchorText = grid.store.getValue(item, 'anchorText');
   return "<a href='" + value + "'>" + anchorText + "</a>";
}