Fábio Fábio - 6 months ago 20
Javascript Question

SearchBar on submit

I'm trying to get the events of the search bar, but there is no answer...
It is necessary to do something more?

ts:

import {CompaniesViewModel} from "../../shared/models/companyModel";
import {Page} from "ui/page";
import {SearchBar} from "ui/search-bar";

export function pageLoaded(args) {
console.log('pageLoaded');
var page = <Page>args.object;
page.bindingContext = new CompaniesViewModel();

var searchBar = new SearchBar();
searchBar.on(SearchBar.submitEvent, function (args) {
console.log("Search for " + (<SearchBar>args.object).text);
});
searchBar.on(SearchBar.clearEvent, function (args) {
console.log("Clear");
});
}


xms:

<SearchBar row="1" text="{{ search }}" hint="NIF ou Nome da empresa" id="search" />

Answer

This is because the searchBar variable is initialized with a new SearchBar and has nothing to do with your search bar defined in XML. So your TS should be changed to:

import {CompaniesViewModel} from "../../shared/models/companyModel";
import {Page} from "ui/page";
import {SearchBar} from "ui/search-bar";

export function pageLoaded(args) {
    console.log('pageLoaded');
    var page = <Page>args.object;
    page.bindingContext = new CompaniesViewModel();

    var searchBar = page.getViewById<SearchBar>("search");
    searchBar.on(SearchBar.submitEvent, function (args) { 
        console.log("Search for " + (<SearchBar>args.object).text);
    });
    searchBar.on(SearchBar.clearEvent, function (args) {
        console.log("Clear");
    });
}
Comments