Is there a way to highlight a specific item in the search results? - jquery-chosen

I have been trying to implement a slight change in the behavior of the chosen dropdown search results, but there doesn't seem to be any straightforward way to get at them. I have a list of countries preceded by three-letter ISO country code. I would like to be able to search as usual, but highlight the country if there is an exact match on the country code. The problem is that the matching country code will not always be the first item in the list. A more general request would be able to access the result list, and set the selection to some item other than the first.
By inspection, it looks to me like the search results only exist as a jquery object and within that the list items include a data-option-array-index with the original option list index, so I could find the item that I know I want highlighted in that DOM object and set the class "highlighted". But I also might need to scroll it into view, and messing with the underlying DOM directly is not ideal, so it would really be nice to have access to Chosen functions that would do that.

So, I figured it out, by accessing DOM. I have the index in the initial array that I want to highlight, and the following code will do it, assuming it is in the result list (using lodash _.find):
var highlightChosenResult = function(index) {
var resultList = $('li.active-result');
var result = _.find(resultList, function(el) {
return +$(el).attr('data-option-array-index') === index;
});
if (result) {
this.chosenApi.result_do_highlight($(result));
}
}

Related

Is it possible to convert a string to the name of a list?

Before we come to the actual question, I'll need you to understand my App.
I have a function add() which feeds integers based on the user's input into a list. This list of integers is fed into a function avg() which calculates the average of all the integers inside of the list.
This list however, is bound to a widget which can be added infinite. But before a title for that widget must also be provided by the user.
Imagine it like that: You click on a floatingActionButton and a TextField opens. In that TextField you type in a title. After you submit the title a Box is crated with that title.
Inside this Box you have the possibility to click a Button which opens a new TextField. In that textField you type in an integer between 0-15 which then is added to the list bound to the widget.
That's why I need a new list of integers to be created, whenever I create a the users creates a new Widget.
That's why I was wondering if there is a way to just take the String of the title (lets say 'my awesome title') and use that to define a new list with that string (my thoughts in code are below).
Something like this:
String title = 'title';
List<int> 'title' = [];
Everything I found regarding this topic, didn't really covered the answer I was looking for. So please excuse me if this question was asked in a similar way before. I probably didn't understood it, hopefully you can help me out better. :)
If it is not possible to convert a String to a list name, I would love to hear about a different technique which would solve the problem explained.
If I understood you correctly You want to save the value as a identifier/variable name and use that for fetching other values? like list of integers.
In that case thing which might suit your case would be Map or key/value pairs.
Lets say you got a String from server or any other way.
String title = await getStringFromServer();
List<int> data = await getIntegersfromSomewhere(title);
Now you might want the map to come in action. you can save these values in map.
final Map<String,List<int>> _map = Map();
map[title] = data;
Now your map will contain whatever string you got from the server or from anywhere. and corresponding list of integers.

How to display distinct count in a hierarchical menu?

I am using instantsearch, hits and hierarchical widgets.
I have the following:
As you can see, there is a discrepancy between the count in the categories and the number of results we see.
The thing is it shows the count for the number of grouped results (ie. there is 3 variants of this camera) while showing one distinctive result since I set distinct to true.
I looked there and did not find anything useful.
How can I make the hierarchical menu display the right count?
You should be able to use the parameter facetingAfterDistinct. You can provide this parameter to the configure widget (if available) or to the searchParameters option exposed on instantsearch. Here is an example:
const search = instantsearch({
// ...
searchParameters: {
facetingAfterDistinct: true,
}
});

DC.js - deselect feature or filter all but the ones that are clicked

I'm not sure if this is possible and no luck on researching this. I'm working on a dashboard using DC.js charts and crossfilter.js. I'm going to use a Row chart as an example. Instead of clicking on the items to filter, is it possible to do that opposite?
For example. When I click on an item from a row chart, instead of filtering on that selected item, it will deselect that item and filter the rest of the other items. And then I will keep clicking on other items to deselect.
Pretty much my goal is to implement a feature where a user can hold the 'CTRL key' and 'left click' the items in the Row Chart to deselect. This way a user dont need to click more than 50+ items in the row chart to filter and have few items not to filter.
I do have a code where Javascript detect an event where "CTRL" and "Left click" triggers. but not sure of how to filter all except the ones that are clicked.
I hope this makes sense. I tried to look at the DC.js or Crossfilter api and I cannot find a function that can do that or am i missing something.
It sounds like you want the same behavior except for the very first click, where you want to keep everything else and remove the clicked item if ctrl is pressed.
If there is anything selected, then a click should toggle as usual, whether or not ctrl is pressed.
As Ethan suggests, you could probably implement this as a filterHandler. That should work too, but since it's mostly the same behavior, I'd suggest using an override of onClick.
Unfortunately the technique for overriding this method is not pretty, but it works!
var oldClick = rowChart.onClick;
rowChart.onClick = function(d) {
var chart = this;
if(!d3.event.altKey)
return oldClick.call(chart, d); // normal behavior if no mod key
var current = chart.filters();
if(current.length)
return oldClick.call(chart, d); // normal behavior if there is already a selection
current = chart.group().all()
.map(kv => kv.key)
.filter(k => k != d.key);
chart.replaceFilter([current]).redrawGroup();
};
I used the alt key instead of ctrl because ctrl-click on Macs is a synonym for right-click.
I'm using this on the rowcharts where I need this feature.
It's a little bit shorter than the other answer, maybe it can be useful to someone (I don't know which is better).
// select only one category at a time
mychart.onClick = function(_chart){ return function (d) {
var filter = _chart.keyAccessor()(d);
dc.events.trigger(function () {
_chart.filter(null);
_chart.filter(filter);
_chart.redrawGroup();
});
}; }(mychart)
Where mychart is the name of your dc.rowchart
var mychart = dc.rowChart('#mychart');
[EDIT]
This one works too, is shorter, and works with barcharts
mychart.addFilterHandler(function (filters, filter) {
filters.length = 0; // empty the array
filters.push(filter);
return filters;
});

Jface ViewerFilter filtering full tree depth

I have a FilteredTree that displays many nodes, where each node can have multiple children and subchildren (n-depth).
The filter filters all nodes (and children in any depth) that match the pattern.
Now I want to add another search functionality:
Every node represent an object , each object has some fields, so i want to list the nodes that have fields that match the text.
I tired to use ViewerFilter.
The problem with it that it doesn't invoked for every node in the tree only for current opened branch.
public class TheFilter extends ViewerFilter {
private String searchString;
public void setSearchText(String s) {
}
public boolean select(Viewer viewer,
Object parentElement,
Object element) { //triggered Only for one level
return true;
}
}
Update:
When the searched item is found I want to show not just that node that contains the searched item but also it's parent (all parents).
FilteredTree accepts an org.eclipse.ui.dialogs.PatternFilter as argument to determine it's filter strategy.
You can achieve the desired result by subclassing PatternFilter and overriding it's isLeafMatch method.
For example:
PatternFilter filter = new PatternFilter() {
#Override
protected boolean isLeafMatch(Viewer viewer, Object element) {
String field = ((Node) element).getField();
if(field== null) {
return false;
}
return wordMatches(field);
}
};
FilteredTree tree = new FilteredTree(parent, SWT.MULTI | SWT.H_SCROLL
| SWT.V_SCROLL, filter, true);
As I understand you want the search to be applied to all elements regardless of the fact that they are currently expanded or not. Although I am not sure why would you want the filtering to applied to the deepest leaf as well, is it because you want root nodes that will not show any children to disappear as well?
There could be several ways here, if you want to force your filter to be applied to all elements, you can expand all items in the tree using TreeViewer#expandAll, unless you are using a lazy content provider it should invoke filtering on all elements. You may collapse the tree again if you don't want to keep it expanded (may want to disable drawing while expanding and collapsing to avoid flicker through Tree#setRedraw(boolean)). Usually in trees when something is being searched, all filtered content is shown as expanded so that the deepest leaf that also matches the search criteria is also visible. If you want to maintain tree's expansion states of each element just as the user had done, it will require a little more work to expand all and then restore expansions.
Another approach is to implement the searching within the content provider. So your content provider can take the current search criterion and return only elements that match it. This means that you will have to manage yourself whether a certain parent should be visible or not. So on change of search field you only need to refresh tree and your content provider will ensure filtering.

Dashcode - how to register and use my own filterPredicate procedurally

In my Dashcode mobile app I have a listView that is bound to a datasource. By default it shows everything in the datasource. If I add a search field the user may limit the list to just the records that match their search text.
I want to create my own preset searches attached to buttons that would be able to load a list view and show only the records from my datasource that match my custom search.
It seems like this ought to be possible, but so far I haven't figured out how to register my own filterPredicate and then use it.
I'm guessing this is what I want to do because it seems like this is what the search field part does.
Has anyone figured out how to do this?
Any help would be appreciated
According to the dashcode starter section, you could use something along the lines of:
itemDescription = Class.create(DC.ValueTransformer, {
transformedValue: function(value){
return "Page: " + value;
}
});