ehynds / jquery-ui-multiselect-widget Goto Github PK
View Code? Open in Web Editor NEWjQuery UI MultiSelect widget
License: GNU General Public License v2.0
jQuery UI MultiSelect widget
License: GNU General Public License v2.0
Hey Eric,
First of all, thanks a million for such a great plugin!...
After working with it for a while, I needed to filter using optgroups and discovered it wasn't working properly. The main reason was that the cache wasn't being built.
I've proposed a fix that you'll find here dariocravero@5cee8ff
I tried to create a test case for it but just didn't have the time to do it. However, the test case should be something like:
given a form with a multiple select containing a few groups like this:
Group: "aa":
Options: "aa1", "aa2"
Group: "bb":
Options "bb1", "bb2"
if I filter by "aa",
I should get the list of fields "aa1", "aa2"
Cheers,
Dario
If you create a multiselect at the bottom of a widget, when you open the multiselect it just makes the widget content longer and you have to scroll down to see the multiselect options. Instead, the dropdown should be created at the root of the DOM and absolute positioned to be below the element (or differently if the position option is passed), and the zindex of the dropdown should be set by calling $(element).zIndex() to ensure that it's at the same layer as the dialog.
Hello,
In few days I signal you a problem with the validation check. You ask in the page of project, that in the 1.6 it fixed but not.
Here's an example that not work with version 1.6. I prefer to give you all
Here : http://paul.borel.free.fr/erreurMultiselect.zip
Thanks
the title describes i guess the problem
checked="checked" not working must use selected="selected"
selected="selected" works for radio, checkbox.
Generated markup jQuery MultiSelect UI Widget 1.3 (works):
Välj månad..
Generated markup jQuery MultiSelect UI Widget 1.4.1 (breaks):
Välj månad..
now that the name attr on the inputs has been removed, the single select option is broken
With the following lines of code
$("#state").multiselect({ minWidth: 300 }).multiselectfilter();
$("#state").multiselect("destroy");
$("#state").multiselect({ minWidth: 300 }).multiselectfilter();
The filter will not be displayed when the multiselect is re-created the second time, it will the first time.
When used in the ui dialog these lines causes the dialog to close
html.push.......href="".....
changing the href to include a # sorts the problem:
html.push......href="#">.........
html.push......href="#'>..........
There seems to be some compatibility issues with the validate plugin: http://bassistance.de/jquery-plugins/jquery-plugin-validation/
It does work with the lastest version of validate, but not performing as good as without. Also, jslint is reporting that trigger isn't properly called. Don't know if this error is with validate or with multiselect.
When running the new method 'refresh' I noticed that the filter plugin stopped working.
selectedText doesn't seem to work with the current build. It doesn't trigger at all.
Edit: After further investigation, it seems that this is because _toggleChecked does not trigger.
Using jQuery 1.4.2 and UI 1.8.2.
from the comments:
Im trying to retrieve the values of the multiselect on the server. It is working great. However there's a problem when dealing with optgroups.
If the entire list of 20 items is not checked, and i clicked on an optgroup that contains for example 3 items, on the server side all 20 items are submitted and not the the selected 3. However if you manually click on the 3 items one by one without using the optgroup, on the server side only 3 are received.
Is this a bug or am i missing something? Appereciate your help
Setting multiple:false to create a list of radio buttons was rendering the radio buttons unselectable in IE7. Adding a name attribute to the inputs seemed to work.
I changed:
"type="'+(o.multiple ? "checkbox" : "radio")
to:
"type="'+(o.multiple ? "checkbox" : "radio" name="multiselect-radios")
much like the dialogClass option in UI dialog
When an Radio is in play and we allow only 1 item to be selected can we have an option so we can hide (close) the drop down because either way they cant select anymore...
cache isn't being created
from the comments:
"A small issue with the 1.7 version and filtering - now if we have multiple == false the header will never show up, so even if we use the filter addon it will never show up for a list of radio fields.
Instead we should only hide check / uncheck all links if multiple == false not the header (line 157). "
As the title says, when using single select {multiple: false} the "Check all" and "Uncheck all" links shouldn't be shown as it doesn't really make sense.
Firefox doesn't retain multiselect (with optgroups) values on page refresh. Basic multiselect works like intended (view demo on the blog post).
After a clean init, running this code the first time:
$("select:first").multiselect("widget").find(":checkbox").trigger("click");
will correctly check all boxes and fire necessary events, but running it a second time leaves "1 selected" as the button value
"When you click on the OptGroup heading, all options in the group are selected, which is a nice touch. However, selecting options in this way is not caught by the "max checked" function"
At the moment an option can only have 2 states, selected or not. Options could have a third state (using an 'x') which would imply exclusion. Then one could select option A but exclude option B by clicking option A once and clicking option B twice (to get the 'x' instead of the tick symbol).
This functionality could be optional.
If you have a form containing a button input of type "reset" the plugin has a couple of problems:
There may be other issues but these are the two I've come across in my testing so far.
Using version 1.5 in Firefox 3.5.10.
... to .ui-icon-triangle-2-n-s
The filter allows for RegExp patterns. In IE8 this produces errors. Enter in a backslash (/), or bracket ([]) to produce the JS error. The filter should escape the entered terms appropriately.
Refer to the bottom of this page for a quick fix - http://simonwillison.net/2006/Jan/20/escape/
--- jquery.multiselect.filter.orig.js 2010-12-03 11:16:07.793560000 -0600
+++ jquery.multiselect.filter.js 2010-12-03 11:18:42.518315000 -0600
@@ -87,6 +87,7 @@
} else {
rows.hide();
+ term = term.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
var regex = new RegExp(term, 'gi');
this._trigger( "filter", e, $.map(cache, function(v,i){
if( v.search(regex) !== -1 ){
There's a missing comma on line 44: title = el.attr('title')
Regards,
Marcus
right now html is created with a string and then joined together. using the jQuery API is inline with how the official widgets are created
Hi Eric
it has been mentioned once in the blog comments and marked as fixed, but it seems to me the problem is still there in the 1.5 release, for example by
var select = 'CH ';
$("#testlist").multiselect("widget").find("input:checkbox").each(function (chkindex) {
if (this.title.indexOf(select)>0) {
if(this.checked==false) {
this.trigger("click").attr('checked', true);
}
}
}
it will report one item less than actually 'x of n items selected'...and will correct itself by any manual select/deselect clicks.
please verify and wish you can correct this, and thanks for such a great extension to the UI collection! :)
Cheers, Paul
Trying to use this widget with Knockout.js(http://www.knockoutjs.com), so far I was able to update the observed var setting its value on the multiselect click event but when I add some value manually on the observed var the multiselect doesn't refresh to check the correct values.
"when I try to write something in the filter I get a warning : 'The 'charCode' property of a keydown event should not be used. The value is meaningless.'"
from the comments:
"Hello, i'm having a problem with the filtering plugin and i can't make it work right. When you search something and insted of clicking to check the result you choose to click "check all" and then send the post to the server, when it comes back, all items (even the ones that were shown 'cuz of the filter) returns checked."
The first selectbox does not remember selection after page refresh.
When i have more then 1 selectbox on my page, all but the first one remember the submitted values on page refresh.
To replicate the bug: place one selectbox (or more) and a submit button on your page. Select values X and Y. Press submit and make the new page set option values X & Y selected="selected". Reload your page. The first selectbox always resets it selected values.
need to find a solution other than detach() on the option tags.
clicking on the title of an optgroup while the filter plugin is applied will not select the underlying option tags, in at least FF3.6
Trying to empty the noneSelectedText by specifying '' or "" results in this error:
'this.button.contents().1' is null or not an object
You've fixed webkit issue, but minimized version is older than that fix.
Maybe it would be better to run minimization with git-hook or some other automation method?
Hi
I have an issue with multiselect.
For some reason it doesnt position it self correctly - see screenshot here http://dl.dropbox.com/u/2111180/multiselect.png
I tried with both multiselect() as well as multiselect(opts) where opts is just a dict with my swedish translations, nothing more.
If you need any info about my css just let me know.
Thanks
from Ilya Tretyakov - The "close" event may be attached only in the initialization. No one "someTing.bind('close',function(ev,ui){..." do not work.
clicking on the filter input box apparently is firing multiselectclick
I just upgraded from 1.6 to 1.7, and noticed a bug that appears in Chrome for Windows but not Firefox (dunno about others). Basically I have a select with five option's, and one of the option's has selected="selected" set. I initialize the multiselect on that select, with the flag multiple: false. In v1.6, this worked beautifully, and the one selected option had its radio checked and name appeared in the button. But in 1.7 in Chrome, the selected="selected" is ignored, and nothing is selected. The same page viewed in Firefox works as expected (and as 1.6 works now in both pages, after I just downgraded).
seems to call both open then close?
When clicking outside the checkbox menu the close event triggers twice due to the click event created on line 254 (http://github.com/ehynds/jquery-ui-multiselect-widget/blob/master/src/jquery.multiselect.js#L254). This click event also triggers twice when a checkbox is clicked.
apparently if you open a multiselect that is stacked on top of another, the other's button bleeds through the menu in IE 7 and 8.
trigger("click") on the checkboxes doesn't work right for a selectList - it only takes the first one. It does work when click() is triggered on the input itself, see http://jsfiddle.net/ehynds/z7ptm/
all subsequent multiselects drop their selected values on page refresh in at least FF.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.