jQuery UI Widgets › Forums › Lists › ComboBox › The 'val' method doesn't work when using anything in Array.prototype
Tagged: Angular combobox, angular2 combobox, bootstrap combobox, javascript combobox, jquery combobox, jqwidgets combobox, jqxComboBox, typescript combobox
This topic contains 3 replies, has 2 voices, and was last updated by Hristo 7 years, 9 months ago.
-
Author
-
February 2, 2017 at 11:26 pm The 'val' method doesn't work when using anything in Array.prototype #91228
I’ve set up a combo box that filters as you type.
Code for the widget’s ‘search’ property looks like this:
var sources = [...] // array of items defined earlier. Each item has a 'value' and a 'label' property var fieldWidget = $('<div>'); var widgetSettings = { valueMember: 'value', displayMember: 'label', minLength: 0, remoteAutoCompleteDelay: 1, remoteAutoComplete: true, search: function(query){ // Filter the source by the query. var filteredSource = []; for (var i in source){ if (source[i].label.toLowerCase().indexOf(query.toLowerCase()) !== -1){ filteredSource.push(source[i]); } } // Get the search text to preserve, since it will be wiped out when updating the source. var searchString = fieldWidget.jqxComboBox('searchString'); // Update the source. fieldWidget.jqxComboBox('source', filteredSource); // Restore the search text. fieldWidget.jqxComboBox('val', searchString); }, // ... other settings not relevant to this example are here
There are 2 issues.
1) The first is that when updating the source (via .jqxComboBox(‘source’, newSource)), the search text is removed. That’s accounted for in this code because I store the search text in a variable, update the source, then restore the search text after. This allows the source to be filtered as the user types. So I’ve got a workaround in place for this.
2) The second issue is one I just stumbled across. I was typing “something” in to the field to test an unrelated feature. After typing the first 4 letters (“some”), the search text was erased. Any other text I tried typing seemed to behave normally. But the word “some” seemed to be odd. I found that the problem was with the call to .jqxComboBox(‘val’, searchString). It would normally work, but when searchString was equal to “some” (or ” some” or “some ” – leading and trailing whitespace was ignored), setting ‘val’ wouldn’t work. I believe this is due to a bug in the Combo Box library (and possibly others).
Thinking the word, some, was probably not the only one that triggered this odd behavior, I wrote a script to test it.
(function(){ var widget = $('#{combo_box_widget_id}'); var input = widget.find('.jqx-combobox-input'); var dictionary = getDictionary(); var broken_words = []; for (var i=0; i < dictionary.length; i++){ var word = dictionary[i]; input.val(word); widget.jqxComboBox('val', word); if (input.val() != word){ broken_words.push(word); } } console.log('broken words: ', broken_words); function getDictionary(){ return [...]; // I found an English dictionary file (~152k words) online and formatted it to work in a javascript array. } })();
The results were:
constructor, entries, every, fill, filter, find, includes, join, keys, length, map, pop, push, reduce, reverse, shift, slice, some, sort, splice
The pattern seems a lot more clear. It’s a list of properties on Array.prototype. (For reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype)
So it’s apparent that inside the call the ‘val’ method of jqxComboBox, there’s something wonky going on when dealing with an array. For now, as a workaround, I’ll just skip running the search if the search text matches a property on Array.prototype. But it would be nice if this were fixed.
February 3, 2017 at 11:41 am The 'val' method doesn't work when using anything in Array.prototype #91247Hello tmcneill,
It is normal to happen when you change the source.
You could try to use the DataAdapter –source.localdata = data2; adapter.dataBind();
.
Also, I would like to suggest you trybeforeLoadComplete
callback of the DataAdapter and to filter the records there.Thank you for this feedback (“some”).
Best Regards,
Hristo HristovjQWidgets team
http://www.jqwidgets.comFebruary 3, 2017 at 4:53 pm The 'val' method doesn't work when using anything in Array.prototype #91266Regardless of how the search filtering is done, the main point of making this post is to point out the bug with the ‘val’ method of jqxComboBox. You did not acknowledge this bug at all in your reply. Specifically, when calling .jqxComboBox(‘val’, str) where str is a property of Array.prototype, no value is set.
So while it’s possible that using a data adapter would obviate the need to use the ‘val’ method, as I mentioned, I’ve already found a workaround for this bug for now. I’m not asking for a workaround. I’m asking for the bug to be fixed so the ‘val’ method functions correctly.
February 6, 2017 at 8:46 am The 'val' method doesn't work when using anything in Array.prototype #91294Hello tmcneill,
Thank you for all your assistance and for this feedback.
We really appreciate your help in resolving the issue.Best Regards,
Hristo HristovjQWidgets team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.