Coldfusion cfgrid type= boolean checkbox

As a follow-up on thi spost, now 6 years on, I'll note that I just discovered that the link I offered to the example on my site has been failing since I changed to running CF2025...and that's because CF2025 removed a few attributes that Pragati had been using in their original example offered.

In particular, CF2025 removes support of these cfgrid attibutes used in this example: SORT,VSPACE,PICTUREBAR, and GRIDLINES. (There are still more attributes that CF2025 removes, as listed in the docs page here.) CF2025 also removed flash support, and as such it removed use of attributes that were RELATED to that...and it turns out Pragati had the "visible" attribute, which was specific to flash *though they were using format="html".)

Anyway, I have now removed all those attributgs no longe supported--at least so that the page no longer fails. I will leave to other interested readers to assess whether those changes have any bearing on the issue being discussed. It was too much for me to review, no 6 years on...when I suspect virtually no one cares about the issue any more.

But I wanted to stop the errors happening on my site--and I didn't want to make the changes without explaining how what "works" now may not reflect what "worked" back on CF2018 or earlier as of this post from 2019.

I figured it out. First a TLDR explanation, then elaboration for those interested.

TLDR:

It turns out that the first click is to SELECT the row, to be edited. THEN you can edit things/click checkboxes.  I have a link to a slightly modified demo that makes it more clear. See the section below, "A demo that better clarifies things".

ELABORATION (for the curious):

It took some trial and error (and I did setup a test on my own server, and DID see the same behavior). And wow, what an explanation it turned out to be. It's not a bug but a "feature" with perhaps-unexpected results.

Again, it turns out that the way that an "editable" cfgrid works (as you indicated using selectmode="edit") is that in order to proceed with editing ANY cell in a given row, you need to first click on the row (any cell in the row)--and THEN you can edit any of the cells. You can even see this in how the color of the row changes when you FIRST click it, indicating it has been "selected", and THEN you can change it.

So it turns out that the first click you (and your users) have been doing has been to SELECT the ROW, thus enabling it for editing, and then when you clicked that checkbox, you were toggling it. But only AFTER having "selected the row" first.

I realize some may find that hard to believe (feeling either that I am wrong, or that it's a stupid design feature). Let me offer some proof, first in docs then in an example that with one more column makes things more clear.

The docs

First, in the docs for cfgrid, it does explain this. It's NOT in the CFML Reference, though (where folks nearly always seek answers). Instead, it's in the "Developing Applications" manual (which is nearly as large, and is more a CF "user guide" then "reference").

And in the page on CFGRID, which is here, the first section ("Working with a data grid and entering data") has a table of grid "actions" and "procedures", and for "Editing a grid cell", it says: "Double-click the cell. Press Return when you finish entering the data."

Before I did the next step below, I was like the OP here, wondering, "what the heck is happening".  But I sensed that there had to be an explanation for what we were seeing, and as I searched the docs for ANY discussion of "click" relative to cfgrid and related tags, I finally found that.

A demo that better clarifies things

And then to make the behaviore more obvious (for myself and others), I added a second column with some text, and you can see it quite clearly now. I have set it up and left it on my server as an example here: https://www.carehart.org/test/test-cfgrid-10755642.cfm. 

Notice that until you click a row, you can't edit the fname column. Once you do, you can--and you can toggle the checkbox as you like. And again you can see the row color changing, which is reflecting the row being selected. It was just less obvious when ALL you had was a checkbox (as your code example at cffiddle.org showed).

Your options going forward

So there you have it. I appreciate again that it may seem "a stupid design decision" by Adobe, but actually it does make SOME sense (that one would click a row to indicate a desire to edit it). I suspect you MAY find someone has offered (or will offer) some way to perhaps tweak how this works, or will propose you just indicate to users this behavior.

But certainly others will use this as a chance to explain "this is another reason why no one should use the CF-provided UI-generating tags". I'm not so firm on that point as others, but I appreciate their point.  There are many reasons those tags can bite you (though not always).

And I suspect that you could find some other javascript library or framework that does a better job with such a grid, maybe making it "live editable" immediately, without need of clicking on a row. I have not found anything in the docs to suggest that CF offers that, so if you really find this "click a row first to edit it" design to be not suited to the user experience you or your users desire, it seems you may have to look at another solution for your grid.

Let us know what you think.  Unless someone helps me see something I'm not, I'd next turn this into a blog post, in case it may help others who may not find this here.

Hi pragati9126

Could the cause be the custom Javascript code? The page might be loading it in an unexpected order, relative to ColdFusion's own Javascript.

Disable your custom Javascript temporarily and see what happens. 

I realize you may think it's broken, but most likely it's not. There are a few more steps that could help us get to the bottom of what you're seeing. 

First, it would be helpful if you could confirm seeing any errors in your browser's developer tools, either in its console or network tabs. Are you familiar with doing that? That could tell us WHAT the problem is. 

As for HOW the problem happened, it could be that someone updated cf and there was an error during the update. Do you have access to the cf server itself and its logs?

I could provide more on the both the above, as needed. 

Finally, it would be best if you could provide a simple few line demonstration of the problem, which you and anyone reading this might run to confirm they see the same problem.

Often, in doing that last effort, we find that folks even discover the cause of the problem, if it may well be about their code.