Sortable - onClick event fired when moving a SortableItem to a lower index
See original GitHub issueHi !
I’m facing an issue using sortable: when I’m moving a SortableItem from right to left, the onClick event is fired along the onDragEnd event. This isn’t happing if I’m moving my item to the right.
Here is the simple sample of code I’m using:
<DndContext
sensors={sensors}
collisionDetection={closestCenter}
onDragEnd={handleDragEnd}
modifiers={[restrictToParentElement]}
>
<SortableContext
items={displayedArticles.map(article => article.id)}
strategy={rectSortingStrategy}
>
{displayedArticles.map(article => (
<Article
key={article.id}
name={article.name}
id={article.id}
onDeleteClick={() => {
setArticleToDelete(article.id);
}}
onClick={() => console.log('onClick fired')}
/>
))}
<Add onClick={onOpen} />
</SortableContext>
</DndContext>
And here is a video of what’s happening:
Is this an expected behavior ? Do I miss something ? Is there a way to completely silent onClick when the Item has been dragged ?
Thank you !
Issue Analytics
- State:
- Created 2 years ago
- Reactions:4
- Comments:11 (2 by maintainers)
Top Results From Across the Web
Jquery sortable 'change' event element position - Stack Overflow
Since the element where drag starts is ui.helper , and the element of current position is ui.placeholder , we can take the elements...
Read more >JavaScript Drag & Drop Sortable List Project - YouTube
Learn the drag & drop API, array methods, spread operator, and DOM manipulation in this vanilla JavaScript projectFull 20 Projects ...
Read more >How To Build Sortable Drag & Drop With Vanilla Javascript
IMPORTANT:1 Year Free Hosting: https://www.atlantic.net/webdevsimplifiedUse code KYLE for an additional $50Drag and drop is something that ...
Read more >move - API Reference - Kendo UI Sortable - Documentation
move. Fires when Sortable's placeholder changes its position. Event Data ... The Sortable widget instance which the item belongs to (useful in case...
Read more >How to move an item programmatically with jQuery sortable ...
This works fine except it does not trigger the sortable events like change or update. I have a function which is run on...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Hi @clauderic !
Thank you for your quick reply.
Your workaround doesn’t work in my case because onDragEnd is fired before onClick so I think I’ll go with the DragOverlay workaround 😃
Have a nice day !
Same problem. The onClick event attached to the button inside my draggable element doesn’t trigger anything 😕