ASM ASM - 1 year ago 88
jQuery Question

Passing an ID number to a custom url in JQWidgets

Am trying to pass a user_id value to a custom url using the JQWidgets library any help please. Am actual loading the data from a database converted to JSON. The variable "data" is how my records looks like. The user_id value does not show as part of the url. Below is my code

<div id='jqxWidget'>
<div id="jqxgrid"></div>

<script type="text/javascript">
$(document).ready(function ()
var data = [{user_id:100,user_name:"sam",first_name:"doe"}];

var source =
datatype: "json",
{ name: 'user_id', type: 'string' },
{ name: 'user_name', type: 'string' },
{ name: 'first_name', type: 'string' },
{ name: 'action'}
id: 'user_id',
root: 'Rows',
var dataAdapter = new $.jqx.dataAdapter(source);

// create jqxgrid.
width: 1000,
height: 450,
theme: 'light',
source: dataAdapter,
selectionmode: 'multiplerowsextended',
sortable: true,
pageable: true,
pageSize: 20,
autoHeight: true,
filterable: true,
pagesizeoptions: ['20', '40', '80','200'],
altrows: true,
columns: [
{ text: 'User ID', datafield: 'user_id', width: 100 },
{ text: 'User Name', datafield: 'title', width: 70, cellsformat: 'yyyy-MM-dd'},
{ text: 'First Name', datafield: 'first_name', width: 150, cellsformat: 'F2', cellsalign: 'left' },
{ text: 'Action', datafield: 'action',cellsrenderer: renderer,width:130 }
var renderer = function (action) {
return '<span style="padding:5px;" >'+'<a href="update_user?id=data.user_id" class="btn btn-default btn-xs" style="margin-top:3px;"><i class="fa fa-check-square-o"></i>Update user</a>'+'</span>';


Answer Source

This code worked fine for me. Thanks

{ text: 'Action', datafield: 'ac', cellsrenderer: renderer, width:105 }

var renderer = function (row, columnfield, value, defaulthtml, columnproperties) {
                  var getrow = row;
                  var user_data = $("#jqxgrid").jqxGrid('getrowdata', getrow);
                  var user_id = user_data.user_id;
                 return '<span style="padding:10px;">'+'<a href="update_user?id='+user_id+'" class="btn btn-default btn-xs" style="margin-top:3px;"><i class="fa fa-check-square-o"></i> Update user</a>'+'</span>';

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download