Jump to content

Render a Boolean field in Grid with CheckBox


Recommended Posts

I know that one day, Farshad will add any available field editor/viewer to the grid.

But, for the moment it is not available.

What I do is simple, setting the 'renderer' properties of the field.

Here's what I do to make any Boolean field to be showed/rendered as CheckBox in the grid.


1. Set the Column Tag to 1, this is to mark that this column will be 'rendered' as CheckBox.

2. In the OnShow event of the form that contain the grid, put this code:

procedure TMainForm.UniFormShow(Sender: TObject);
var st,xcolheader:string;
 for i := 0 to j-1 do
   If UniDBGrid1.Columns[i].Tag=1 then
 st:='OnReconfigure=function OnReconfigure(sender, store, colModel) {'+
 'for(i=1;i<colModel.columns.length;i++) {'+
 'if ('+xcolheader+') {'+
 '   colModel.columns[i].renderer=function(v, p, record){'+
 '  p.css += " x-grid3-check-col-td";'+
 ' return ''<div class="x-grid3-check-col''+(v == ''1''?''-on'':'''')+''"> </div>'';}'+


I'm using Firebird, so the boolean value is 0 or 1....

if you are using other DB, then you can modify the v == ''1'' above to any value that you need for 'true' condition....


Hope this can help somebody that need it. Cheers....

  • Upvote 1
Link to comment
Share on other sites

  • 1 month later...

Thanks.It works on WEB application.


But doesn't work checked/unchecked clicking this field . :(


well, as I've said before, this is only for temporary solution with older version of uniGUI.

Since there's a new DBGrid Editor, I think you don't need my tips above.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...