Checkbox is not working on board

[zhagnyu]

I think this is good kanban plugin, but there is an issue.
I added checkbox on each card of boards.

I can check/uncheck these checkbox but checkbox status is not changed.
It is always showing unchecked.

please help me. thank you

[oCyex]

I have the same issue

[marcosrocha85]

Hello and thank you for using jKanban. Actually, when you change "checkbox DOM" aren't changing internal jKanban "DOM". So without some code you won't achieve that. Please take a look at this fiddle and let me know if you have any other question.

[oCyex]

I see
Thank you for your answer

[zhagnyu]

Thank you for your answer. But it is not easy to use because I have too many checkbox in kanban.
Anyway it will be helped for me.

[oCyex]

I did a fake checkbox with css (just a button element); When the user click on it, that toggle the data-id (true or false) and toggle a css class for the apparence.
And since after I parse the DOM, I store also this data-id.
It works for my use

[zhagnyu]

Hello and thank you for using jKanban. Actually, when you change "checkbox DOM" aren't changing internal jKanban "DOM". So without some code you won't achieve that. Please take a look at this fiddle and let me know if you have any other question.

[zhagnyu]

link is not working.
You added a link in this fiddle second feature, but link is not working. I need your help again

[marcosrocha85]

link is not working. You added a link in this fiddle second feature, but link is not working. I need your help again

What do you mean for "not working"? What is "second feature" for you?
jKanban is a Vanilla Javascript Kanban. Any feature must be implemented or pull requested. You need to be more clear.

[WriterStat]

Hi @zhagnyu - This note is a few months old. But zhagnyu is right, click event propagation has been turned off inside a jkanban item.

You can test this quickly when the right-click browser context menu won't show up. Right-click a jkanban item and you'll see what I mean.

Instead of hacking up the code with adding new code to re-implement the browser click event for each element inside an item, you may instead just simply need to turn back on event propagation for the click event.

Here's the answer:

Add this to the bottom of your jKanban object instantiation code:

propagationHandlers: ["click"],
// the event callback specified in the above will not be canceled ... values: "click", "context"

ex:

var kanban = new jKanban({
// stuff
// more stuff ,
propagationHandlers: ["click"]
});

Hope this helps, you can find/see the info on the jKanban Usage area on main page. Not sure if this will cause something else. =) Or why it's turned off? But this will turn it back on.

[WriterStat]

@zhagnyu This will also fix your problem with the link not working, the click event propagation will then work on the link allowing you to click it. Hope helps.

@marcosrocha85 he means the second kanban item in the fiddle you provided. Click the link in the second item you provided to see... no click event propagation, so no click event is recognized on the link you put in there. Also, the button in the fiddle you suggested doesn't work either without a click event.

Hope this helps someone else. Best, -C

P.s. @zhagnyu was really clear in his report, there was only 1 link in your fiddle, and I understood them fine. Sometimes the help is in the current existing code. Again hope helps.

[marcosrocha85]

@zhagnyu This will also fix your problem with the link not working, the click event propagation will then work on the link allowing you to click it. Hope helps.

@marcosrocha85 he means the second kanban item in the fiddle you provided. Click the link in the second item you provided to see... no click event propagation, so no click event is recognized on the link you put in there. Also, the button in the fiddle you suggested doesn't work either without a click event.

Hope this helps someone else. Best, -C

P.s. @zhagnyu was really clear in his report, there was only 1 link in your fiddle, and I understood them fine. Sometimes the help is in the current existing code. Again hope helps.

Oh now I see. Anyways, dragula "eats" some events and you must be creative in order to achieve some features. It's not a jKanban issue itself.

[WriterStat]

Actually, it really is a jKanban feature/issue that you were a part of, in this instance, and it's not dragula.

Hope this helps you,

It's a leftover from an earlier pull request I believe, that you were a part of, that turns off browser event propagation in jKanban in certain places.

Here's the pull request where you discussed it:

... #141

jKanban in its code turns on/off the browser event propagation for some things, from the jKanban code, for some things like so that a person can instead have their own "context" menus instead of the browser context menu in some places etc...

In the above pull request discussion, the author of the pull asked that the browser propagation events be respected first. But you stated that, that would be a mistake.

I would also suggest the browser propagation events be respected first because that's the developer expectation. Then add something in the code to turn it off if a developer wants to, or leave it to the developer to turn it off.

It shouldn't default to browser propagation events turned off, because we expect click events to work in a browser as do users. As did you when you created the fiddle.

To have it default to browser events off and to be turned back on, when a developer doesn't know they are turned off, is truly confusing...against expectation for a web app.

Hope this helps. Figured I should respond to this as it might be something where a better fix here can be created in the lib.

Best, -C

[WriterStat]

The other reason jKanban might turn off browser click events is so that clicking on items inside a board to drag them allows only just dragging/no element interaction.

Basically limiting the user interaction of other item elements inside an item on a board to only allow either dragging or just the internal jKanBan full item coded click event function to work.

Note: it should always be up to a developer using the lib to turn off propagation if this was their wish in that respect. So they'd know it was turned off. Hope helps.

As a side note: The above drag/click entire item to drag gets in the way in jKanban mobile/tablet/touch screen drag/scroll applications.

To get that to work reliably you have to instead use a drag handle and some css anyways because otherwise both the item and the entire page drag/scrolls separately and entirely differently, causing item drag issues.

So maybe best to leave the turning off of browser event propagation to the developer,,, in the lib notes.