In select component, send own filed value along with typed value


#1

this.myData = {
url: this.authService.getServerURL() + ‘trainer/list/’,//+this.currentWorkOutType+’/’,
remoteFilter: true,
dataType: ‘json’,
processResponse: function (data) {
}}
I want to send value of this.currentWorkOutType along with user typed value while load data from remote.
Ex: in select input field, if i type m, the url will be {url}/trainer/list/m
i want my own value like this {url}/trainer/list/{myval}/m

any help plz ?


#2

Hello Raj,

At the moment it’s not supported to pass dynamic parameters to the remote data source. Currently this can be done by running the request yourself inside the onFilter event. You can use Angular’s HttpClient to run the request.

Example:

    selectData: any = [];

    selectOptions: any = {
        // ... other options
        filter: true,
        onFilter: (event, inst) => {
            this.loadData(event.filterText);
            // Prevent built in filtering
            return false;
        }
    };

    constructor(private http: HttpClient) {
        this.loadData();
    }

    loadData(filterText: string = '') {
        const url = this.authService.getServerURL() + 
            'trainer/list/' + this.currentWorkOutType + '/' + filterText;

        this.http.get('data.json').subscribe(data => {
            this.selectData = data;
        });
    }
<mbsc-select [data]="selectData" [options]="selectOptions">Select</mbsc-select>

Please let me know if this helps!