How to provide a hyperlink to a column data in JQgrid and navigate to respective Url based on data clicked?

Question

I have a JQgrid which contains has just 2 columns..I am pasting my code which i have tried below.. ``` var UserArr = new Array(); function Grid() { $("#users_grid").jqGrid({ colNames: ['Site_Name', 'Details'], colModel: [{ name: 'Site_Name', index: 'Site_Name', width: 130,editable: false, sortable: false,formatter: 'showlink', formatoptions: { baseLinkUrl: 'url of respective site i have clicked'}}, { name: 'Details', index: 'Details', width: 400, editable: false, sortable: false }], width: 400, height: 'auto', multiselect: true }); var postJSONData = JSON.stringify({ 'parentitem': parent,'childitem':child }); $.ajax({ type: 'POST', data: postJSONData, url: 'ManageAssetService.asmx/DisplayGridData', dataType: 'json', async: false, contentType: 'application/json; charset=utf-8', success: function success(response) { UserArr = response.d; }, error: function failure(response) { alert(response.message); alert('failed to fetch user details'); } }); var mydata; for (var i = 0; i <5; i++) { m…

Accepted Answer

I have got my solution like this..

The JQgrid column shold be defined like this:

```
colNames: ['Site_Name', 'Details'],
            colModel: [{ name: 'Site_Name', index: 'Site_Name', width: 130,editable: false, sortable: false,formatter: 'showlink', formatoptions: { baseLinkUrl: 'javascript:', showAction: "Link('", addParam: "');"} },
            { name: 'Details', index: 'Details', width: 400, editable: false, sortable: false }],
```

The Javascript function:

```
function Link(id) {

var row = id.split("=");
    var row_ID = row[1];
    var sitename= $("#users_grid").getCell(row_ID, 'Site_Name');
    var url = "http://"+sitename; // sitename will be like google.com or yahoo.com

window.open(url);

}
```

Thats it..

How to provide a hyperlink to a column data in JQgrid and navigate to respective Url based on data clicked?

Solution

Problem

Related problems