I would like to use Jquery's UI autocomplete but with some additional functions: after user selects suggested item, I would also like to display additional data related with that item (for example if database of contacts are being searched, then I'd like to display contact's email, addres...) in some html element.
Is there a way to accomplish this?
Thanks in advance,
Ile
EDIT:
I'd like to provide more detail description of what I actually need:
When user starts searching contacts, as a result from database I would like to return contact's ID and Full Name. After user selects certain contact, then ajax function is called and it retrieves all details from selected contact using it's ID. But I don't know how to do following:
As a result from database return the ID and Full Name of contact as a JSON result (probably I would find the solution to get the right format, but I don't know how it needs to be passed to Autocomplete script)
How to handle the result data so that I display only full name and ID is used only when certain contact is selected, so that I can retrieve full details of certain contact
Have a look at its events: You can add a handler for the select event and display all your informations once it fires.
You can specify extra data in formatMatch function. The parameter must be some delimiter separated string. Later in .result function , which takes 3 arguments [event, data, formatted], you can retrieve it by splitting the formatted by the delimiter use and populate the required values.
Related
I have a tagging system in my application. Now there is one specific entity, for which I want to allow only one tag. Actually I want to assign a parent to a tag.
For this purpose I want to use a VaadinCombobox with lazy loading and filtering.
My data layer is Spring Boot Neo4J Data. There I have a repository like this:
Page<TagListDto> searchPaginated(String searchTerm, Pageable page);
This gives me a data transfer object used for list displays filtered by the searchTerm. The list is pageable. I use the same method for filtering Grids.
So I could do it like this, if I knew where to get the searchTerm from.
ComboBoxLazyDataView<TagListDto> dataView = parentTag.setItems(query ->
tagRepository.searchPaginated(searchTerm,
PageRequest.of(query.getPage(), query.getLimit())).stream());
parentTag.setItemLabelGenerator(TagListDto::getName);
But probably, I'll have to use a DataProvider and a FilterBuilder for the ComboBox, right?
So the answer is to use setItemsWithFilterConverter-method. What you enter into the combo-box field will be sent to the filter converter (2nd method parameter) as a String and then passed as property of the query object to execute the search (1st method parameter).
So if you need to convert the type of the search term from String to some other type, add wildcards or whatever, do it in the 2nd labda.
With query.getFilter() in the 1st lambda you can retrieve the search term and then use that to make the query to your backend.
Here's an example:
ComboBox<Person> personComboBox = new ComboBox<>();
personComboBox.setItemLabelGenerator(Person::getName);
personComboBox.setItemsWithFilterConverter(
query -> personService.searchPaginated(query.getFilter().orElse(""),
PageRequest.of(query.getPage(),
query.getLimit())).stream(),
personSearchTerm -> personSearchTerm
);
Need to create Archer to Archer Data Feed that should set value of two fields as NULL in a cross referenced application, if the value of a field is Approved in first field. I am not getting how can I send a NULL value to the fields through data feed??
Archer doesn't have "NULL" value, but you still can get it done like this:
Step 1. Calculation. Open your data feed configuration and go to the source definition tab. Add a new field to the end of the list and make it calculated.Add formula to check value of 1st field that present in the data source and if it is equal to "Approved" then return empty string.
Something like this
=IF([field field] = VALUEOF([first field],[Approved]), "","SOMETHING ELSE")
The key here is to have this calculation return an empty string when you need it - "".
I suggest you to test your calculation in the calculated field in the application before you put it in the calculated data source field.
Step 2. Data feed mapping. Now you need to map new calculated field in your data feed to the field you want to remove value from. Go to the mapping tab in your data feed configuration and map the field. Make sure to selection options "Replace value" and "Empty Values" - this way existing value will be replaced even with empty values.
Similar approach works for me in multiple data feeds.
Good luck!
You can use novalue() function in the calculation
I don't believe there is a concept of NULL in Archer. The closest you're probably going to get is blank/empty. To do that, in the Data Map tab of your data feed, click the edit icon under Actions column. Check the box that Empty Values should be populated rather than ignored.
Assumption is that what is in the question is the only task required by the data feed.
Create report with the filter set as First Field = Approved
Fields to display should contain tracking id (tracking ID which is configured to System ID) of the Target app along with the Tracking ID of the Cross-Reference App.
In Source Definition add new source and give it an adequate name as clear or Null if you want
Where it says Raw Data Field in the drop-down, update this to static. Leave the source as not configured or unconfigured.
Map this newsource to the 2 fields that you are trying to clear. In Options set to Replace and uncheck add unknown and set to populate empty values.
Map the Tracking ID of the Target app and map the Tracking ID of the cross-reference.
Set key field definition for both apps to the tracking id
Set data feed to update only. Remove checkmark for create
If your are doing more than just clearing the 2 fields, then
Stan Utevski answer is mostly correct except you must have the field you are evaluating for "Approve" in the fields to display of your report. Otherwise the calculation will not validate.
I've an array of objects containing title and salary which is used in typeahead directive.
I display department name and get entire object as value.
If none of the options match, I want user entered string to be converted to object still. Is there any way to update that?
This answer is pretty late, but I would just use ng-blur (to trap the end of the users input) along with a variable bound to typeahead-no-results. Then test if the variable is true in the method bound to ng-blur, and, if so, make an object out of the String supplied by the user and push it to your data source. Simple example found here.
I'm trying to create an autocomplete field in a blackberry app that uses both the first name and the last name of a record to check for prefix matches. My BasicFilteredList is an array of record objects, each having a first name and a last name. I considered adding two instances of the same object array, with mapping String arrays of first and last names like so:
filterList.addDataSet(1, firstNames, recordsArray, "records2", BasicFilteredList.COMPARISON_IGNORE_CASE);
filterList.addDataSet(2, lastNames, recordsArray, "records2", BasicFilteredList.COMPARISON_IGNORE_CASE);
This however retrieves the same object twice. if the person's first and last name begin with the same user-entered prefix in the autocomplete field. In short, I am trying to mimic the existing blackberry contacts autocomplete functionality, but with my own custom records. Any help would be much appreciated. Thank you.
I'm trying to access the values in the FormCollection inside of an action. I can get the value field by doing:
var value = formCollection["MyDropDownList"];
But I can't seem to find a way to get the display value. Am I missing something obvious? A cast perhaps?
Getting text from an HTML drop down selection list using JavaScript code
To get the text from each option is slightly trickier. We use the selectedIndex property of the selection list to capture the selected option and then pass this value to the options[].text property.
Here is the code
var w = document.myform.mylist.selectedIndex;
var selected_text = document.myform.mylist.options[w].text;
I don't think there's a way to get the display column from the formcollection. Basically, the formcollection is an easy way to interrogate the Request object (Request.Form, Request.QueryString, etc.) and the only thing that goes into that are values from input fields.
If you really need to get the display text, you would have to get it from whatever collection you bound the list with and access it via the key (your selected value from the formcollection). For example, if it's a dictionary collection that you bound to the list, use that same dictionary to lookup the value based on the key.
I would need to know more information as to how you're binding the dropdown to help you further.
That's the normal behaviour. When a form is posted, only the name-value collection generated from the form fields are sent to the server. And of course the inner text of the option tag doesn't belong to that collection.
you do it ok, dropdown list sended shows value of selected item not displayed text of selected item...if you want(from some reason, because I am asumming you are filling that dropdown on model right? :)) to see send a display text also, maybe you can put it in hidden field with javascript on every change of selection in dropdown...
cheers