Comments (14)
Small update: I can see that we have a cursor and can delete the item in the select box, this is a bit or a departure from the norm, it would be nice to have either a button to click or a 'clear' option in the dropdown.
from ember-cli-selectize.
I'm starting to realize this is a selectize request.
from ember-cli-selectize.
I thought so. :)
I use the "remove_button" selectize plugin which should be enabled by default on ember-cli-selectize.
http://brianreavis.github.io/selectize.js/ (tab plugins, section "remove_button").
from ember-cli-selectize.
hmmm not seeing it enabled by default.... or do you mean included by default?
from ember-cli-selectize.
I mean enabled (this plugin only works in multiple selects, i.e when multiple=true
).
Here is the array:
https://github.com/miguelcobain/ember-cli-selectize/blob/master/addon%2Fcomponents%2Fember-selectize.js#L41
from ember-cli-selectize.
ah! yes multiselect only 👍
thats cool, ill see what we can do for everything else. comparing it to select2 which has a clear button available for single items.
from ember-cli-selectize.
That is indeed something related with selectize.
Please link here if you find what you're looking for. Thanks.
from ember-cli-selectize.
Just occured to me that a possible workaround might be to use multiple=true
and maxItems=1
.
But don't know how that would work. The selection
property would be an array and you would need the add
action. So, probably not the ideal solution.
from ember-cli-selectize.
yeah, im thinking i just throw in a button and just have the action clear out the bound property for now, but it would be nice if somewhere down the road (whether that be in a selectize addon or here) that we have an option to tack on a close button that's right justified.
from ember-cli-selectize.
Selectize is quite extensible.
You could try to write a selectize plugin similar to "remove_button".
The plugin could just display an "x" next to the "carret down" symbol.
More info on selectize's extensibility: https://github.com/brianreavis/selectize.js/blob/master/docs/plugins.md
from ember-cli-selectize.
There is plugin for that https://gist.github.com/jumika/abe412f1aa2b24ea86e6 and even modification of original remove_button, but change does not propagate to ember. @miguelcobain any idea why clear()
does not work?
export function initialize() {
Selectize.define('clear_selection', function (options) {
var self = this;
var settings = $.extend({
title: 'Clear selection'
}, options);
//Overriding because, ideally you wouldn't use header & clear_selection simultaneously
self.plugins.settings.dropdown_header = {
title: settings.title
};
this.require('dropdown_header');
self.setup = (function () {
var original = self.setup;
return function () {
original.apply(this, arguments);
this.$dropdown.find('.selectize-dropdown-header').addClass('clear-selection').on('mousedown', function ( e ) {
self.clear();
self.close();
self.blur();
return false;
});
}
})();
});
}
export default {
name: 'selectize-clear',
initialize: initialize
};
from ember-cli-selectize.
@Keeo ember-selectize doesn't update on clear because we're not handling the clear
event selectize emits: https://github.com/brianreavis/selectize.js/blob/master/docs/events.md
Setting selection
to null
on the clear
event should make that plugin work.
from ember-cli-selectize.
Thanks, do you want PR? Something like this:
// component
var options = {
onClear: Ember.run.bind(this, '_clear')
};
_clear(){
this.set('selection', null);
},
// initializer
// copy of code above
from ember-cli-selectize.
A PR for that would be great!
from ember-cli-selectize.
Related Issues (20)
- hideSelected and multiple don't work together HOT 1
- v0.5.8 broke the selectize styles HOT 4
- selectize.js:2151 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'
- multiple mode bug? HOT 2
- Selectize changing my model property to null
- Best Practice for adding/removing on a REST/API error
- add 'readOnly' to 'generalOptions ' HOT 2
- Move selectize and sifter from Bower to NPM HOT 3
- select-item action should not fire when selection promise resolves. HOT 1
- Using multiple=true with ember-changeset-validations HOT 3
- Add Support for data-dash-attributes
- Can't install due to missing dependency HOT 1
- Label truncates when second word contains letters in the first in multiple mode HOT 1
- Tooltip for list
- 2 selectors in the same template and options visible for both of them at the same time HOT 1
- Fix breaking changes in FastBoot 1.0 HOT 1
- Migration to power select HOT 1
- DEPRECATION HOT 1
- Deprecated calls to sendAction
- ember-cli-selectize triggers a Maximum Call Stack exceeded errors
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 ember-cli-selectize.