Comments (2)
Hi @jago86,
I need to open multiple folder nodes (multiselection ), but with only one file item selected at the same time.
Do you mean being able to select multiple folders, plus with a maximum of one file selected inside each folder?
If so, I think that you try to use the neighbours
arguments in the selection strategy to achieve what you want:
strategies: {
selection: [
'multiple',
(item, selection, neighbours) => {
// If deselected
if(!selection.includes(item)) {
return selection
}
if (!item.children && neighbours) {
return [
// Exclude file siblings
...selection.filter(
node => node.children || !(neighbours.includes(node))
),
item
]
}
return [
...selection,
item
]
}
],
click: ['select'],
fold: ['no-child-selection'],
}
I made a little fiddle to demonstrate. Hope that will help!
from bosket.
Thanks @elbywan !! Is more or less what I want. I added some changes to adjust to my needs:
strategies() {
return {
selection: [
'multiple',
(item, selection, neighbours, ancestors) => {
// If deselected
if(!selection.includes(item)) {
return [
...selection,
...ancestors,
];
}
return [
// Exclude file siblings
...selection.filter(
node => node.children || !(neighbours.includes(node))
),
// Include item itself
item,
// Include the ancestors
...ancestors
];
},
(item, selection, neighbours, ancestors) => {
// If deselected
if(!selection.includes(item)) {
// If deselected item is a file, don't allow deselection
if(!item.children) {
return [
...selection,
item,
];
}
// If deselected item is a folder, exclude their children
if (item.children) {
return [
...selection.filter((node) => {
return !item.children.includes( node );
}),
];
}
}
return selection;
},
],
click: ['select'],
fold: [
// 'not-selected',
'no-child-selection',
]
};
}
Thanks a lot
from bosket.
Related Issues (20)
- Custom Input field for search HOT 3
- Selecting a node programmatically HOT 1
- Drag on same level HOT 2
- event.dataTransfer undefined during drop event HOT 1
- No seperate classes on leaf nodes vs parent nodes HOT 1
- dragging with handle HOT 1
- Drag and Drop inbetween nodes (re-order nodes) HOT 2
- items dragged off the canvas disappear HOT 1
- Model rebind causes opened nodes to collapse
- Drag and Drop not working on IE 11 HOT 2
- build not working on windows HOT 1
- How to add custom html?
- Edit tree node contents
- Unfold on select but don't fold back when deselecting HOT 1
- Help with the demo HOT 5
- Display method rendered as string not as html HOT 4
- Typescript support?
- bosket + redux tree not call display() props for nested node
- Issue building Bosket/vue
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bosket.