Autocomplete in Android or an Autocomplete plugin


#1

hi, I really need some help, I need to implement autocomplete in a project where I can pass more than one variable like we do in repeaters eg: name, age of the result will display in the suggestion view…and I needed it like yesterday @triniwiz @jen.looper @bradmartin @pete.k @markosko @NickIliev …really need help unrgently


#2

Please be advised that people who volunteer their free time do not like being told something is URGENT, IMPORTANT, etc.


#3

I am deeply sorry @triniwiz @jen.looper @bradmartin @pete.k @markosko @NickIliev, no offence, I did not mean that way…I withdraw those words…please can you help?


#4

I have used https://www.npmjs.com/package/nativescript-autocomplete but ultimately had to go with http://www.telerik.com/nativescript-ui/autocomplete because I wasn’t able to figure out how to update the options with the first one on the fly.

There are also some posts in google about making the first one work with AngularJS.

Good luck.


#5

Sorry, @michaelsowah I haven’t touched this plugin…looks like Randy has some suggestions above


#6

Hi randy, am also using this http://www.telerik.com/nativescript-ui/autocomplete at the moment and am using :nativescript: but I want to be able to do something like:

<au:RadAutoCompleteTextView items="{{ items }}" " id="host-list" suggestMode="Suggest" completionMode="Contains" minimumCharactersToSearch="3" loaded="autocmploaded">
                                <au:RadAutoCompleteTextView.suggestionView>
                                    <au:SuggestionView >
                                        <au:SuggestionView.suggestionItemTemplate>
                                            <Label text="{{ text}}"/>
                                             <Label text="{{ id}}"/>
                                        </au:SuggestionView.suggestionItemTemplate>
                                    </au:SuggestionView>
                                </au:RadAutoCompleteTextView.suggestionView>
                            </au:RadAutoCompleteTextView> 

is that possible(that is pass two and how did you go about it, some examples from your usage would be much appreciated if any<Label text="{{ text}}"/> <Label text="{{ id}}"/> like this


#7

I haven’t had no free time to work on this plugin in a while although i started doing some updates on it a couple weeks back but never completed it


#8

Thanks for just making sometime to respond to this, realised You have been busy lately…can you point me in the direction of extending it just to do
or even this so I can get two items from my array like the repeater allow us to do…


#9

@michaelsowah,

If you need to show the id and the text on the screen you could do this:

<Label text="{{ id +' ' + text}}"/>

Is that what you mean?


#10

something like that,and then is it possible for the id not to show when displaying in suggestion view drops down


#11

That is how I have concatenated 2 variables in my view before. Give it a whirl.


#12

please can you help me out with how you implemented your concatenation for this please


#13

Where you have this code:

Replace those 2 labels with the one:


Binding more objects in JavaScript
#14

thanks so much in the first place, But I need a few clarifications. how di I pass multiple variables to the TokenModel
eg: this is what I have now autocompleteModule.TokenModel(text,id,name)


#15

How are you passing just 1 field now? You could always concatenate at that point.

I do not use AngularJS which makes it hard for me to give you good examples, but I will do my best.

I imagine you have some kind of loops to populate like this?

Taken from: https://github.com/telerik/nativescript-ui-samples/blob/e9c69e877213ef3abaa1e97f86330c57da553df0/sdk/app/autocomplete/getting-started/autocomplete-getting-started-model.ts


Since I don't know the name of your data array I will assume it is countries
private initDataItems() {
        this._items = new ObservableArray<autocompleteModule.TokenModel>();

        for (var i = 0; i < this.countries.length; i++) {
            this._items.push(new autocompleteModule.TokenModel(this.countries[i].id + ' ' +this.countries[i].name,undefined));
        }
    }

The take away from the above code is the concat part: “this.countries[i].id + ’ ’ +this.countries[i].name”.

Another solution would be to have the server api to combine the data before it gets to your app.

Mysql:

select concat_ws(' ',id,name) as name from table

or

select concat(id,' ',name) as name from table

If you did this, then you wouldn’t need any custom coding on the app side. the default one value examples would do the trick.


#16

@randy I also don’t use angular.
great this is fine, So in the view eg; when I search for a country, I want to be able to see the country only but when its selected I want the id to be set


#17

That is not how you explained it earlier.

You do not want to concatenate then.

How I handled this was this way:

After the value has been chosen from the autocomplete loop over the array or object used to populate the autocomplete and when the country value in the array or object matches the auto complete country get the id.

Here is an example:

Object.keys(j).forEach(function (key) {
          
           let obj = j[key];

          if (s == obj.description) {
          console.log(obj.id);
          }
});

s is the autocomplete value.


#18

thanks so much, I solved it by re-modelling my json data