jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Conditionally show/hide edit button in renderer
Tagged: Button, cellsrenderer, columntype, grid, jqxgrid
This topic contains 2 replies, has 2 voices, and was last updated by sjkcwatson 10 years, 3 months ago.
-
Author
-
Is it possible with this example
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/popupediting.htmto use the cellrenderer on the “edit” button column to show/hide the edit button based on conditions for that row. For example, if the current user has permission to edit the row, show the edit button. If they do not, leave the cell blank.
I have figured out how to return ‘Edit’ or ‘Locked’ as text and how to lock down the row from editing, but I would prefer to not show the button at all or possibly use an edit image and display a blank image if it cannot be edited.
Thanks!
Hello sjkcwatson,
cellsrenderer for
columntype: 'button'
only changes the text of the buttons. You would be able to use an edit image and display a blank image if the row cannot be edited by applying cellsrenderer but to a column with another type.Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/Thank you, I was able to make it work using an image like in this example .. http://www.jqwidgets.com/community/topic/edit-imagebutton-in-grid/.
Since I search these forums for assistance before asking, in case someone else is searching
{ text: 'Edit', datafield: 'Edit', width: 50, columntype: 'number', cellsrenderer:editcellrenderer
var editcellrenderer = function (row, column, value, defaultHtml) { var rowAddedByEmpID = $('#jqxStatusGrid').jqxGrid('getcellvalue', row, 'AddedByEmpID'); if (vAllowEdit != 'T' && (rowAddedByEmpID != cs_empID)) { return '<div style="width: 100%"> </div>'; } else { return '<div style="width: 100%"><img src="images/newicons/pencil.png" style="margin-left: 25%" /></div>'; };
$("#jqxStatusGrid").on("cellclick", function (event) { var column = event.args.column; var rowindex = event.args.rowindex; var columnindex = event.args.columnindex; if (columnindex == 3) { // open the popup window when the user clicks a button. editrow = rowindex; // get the clicked row's data and initialize the input fields. var dataRecord = $("#jqxStatusGrid").jqxGrid('getrowdata', editrow); var rowAddedByEmpID = dataRecord.AddedByEmpID // $('#jqxStatusGrid').jqxGrid('getcellvalue', row, 'AddedByEmpID'); if (vAllowEdit == 'T' || (rowAddedByEmpID == cs_empID)) { //Allow Edit var offset = $("#jqxStatusGrid").offset(); $("#popupWindow").jqxWindow({ position: { x: parseInt(offset.left) + 60, y: parseInt(offset.top) + 60 } }); $("#ecapaStatus").val(dataRecord.CAStatus); // show the popup window. $("#popupWindow").jqxWindow('show'); }; }
The If statement in the cellclick allows for checking to see if the person clicked on the “blank” cell by using the same paramaters that determined if the edit button was shown or not.
Hope it helps.
-
AuthorPosts
You must be logged in to reply to this topic.