jQWidgets Forums

Hi i have two grid. First one has a customwidget column setup and it should perform rowselect or cellselect and update the source of the other grid. I am not sure how to this using customwidget. I would be glad if anyone can produce a solution that I am looking for and it would help greatly.

Also I know how to the above using the columntype method like the one below.

{
text: ‘Edit’, datafield: ‘Edit’, columntype: ‘button’,
cellsrenderer: function () {
return “Edit”;
},
buttonclick: function (row) {
$(‘#jqxgrid’).jqxGrid(‘clearselection’);
$(‘#jqxgrid’).jqxGrid(‘selectrow’, row);
}
},

But I want try doing rowselect/cellselect with using the customwidget like the one below:

{
text: ‘Picture’, datafield: ‘firstname’, width: 100,
createwidget: function (row, column, value, htmlElement) {
var datarecord = value;
var button = $(“<div style=’margin: 6px 0px 0px 15px;’>” + value + “</div>”);
$(htmlElement).append(button);
button.jqxButton({ height: ‘50%’, width: ‘60%’ });
button.click(function (event) {
var clickedButton = button.find(“.buttonValue”)[0].innerHTML;
alert(clickedButton);
});
},
initwidget: function (row, column, value, htmlElement) {
$(htmlElement).find(‘.buttonValue’)[0].innerHTML = value;
}
},

Here is my jsiddle:
https://jsfiddle.net/t69cdhbe/1/