Appcelerator Javascript 搜索功能

Appcelerator Javascript search function

我是 Javascript 的新开发人员,需要一些帮助来搜索和显示数据。

我有一个 TableView(在 index.xml 中),它正在从 index.js 获取数据并且数据在屏幕上显示正常。我还创建了一个文本字段和搜索按钮,但我需要帮助来提取用户输入和搜索存储的数据。

index.xml -

        <Button id="searchButton" onClick="find" class="button">Search</Button>

        <TextField id="SearchtextField" hintText="Search for products: "/>

index.js -

var myproducts = Alloy.Collections.products;

var product = Alloy.createModel('products', {title: 'toy' , desc: 'Toys'});
var product1 = Alloy.createModel('products', {title: 'Yo-yo' , desc: 'Toys'});
var product2 = Alloy.createModel('products', {title: 'Hammer' , desc: 'Hardware'});

myproducts.add(product);
myproducts.add(product1);
myproducts.add(product2);

product.save();
product1.save();
product2.save();

  function find() {



};

我希望用户在 SearchtextField 中键入 'Hammer',然后按下启动查找功能并显示 'Hammer' 的搜索按钮。

谢谢

因此,我将提供一种不同的方法,而不是按要求回答您的问题。

在移动设备上,用户希望有一个一致的用户界面,这意味着列表(在您的情况下是表格视图)上方的 'searchbox' 或 'searchbar'。值得庆幸的是,Appcelerator tableview object 包含一个您无需编写代码的 'search' 内置函数。在此处查看文档:(http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.TableView-property-search)

此处的 TableViews 指南中也有一个示例 (http://docs.appcelerator.com/platform/latest/#!/guide/TableViews-section-29004930_TableViews-Searchingwithinatable)

搜索将自动查找标题与搜索字段中输入的值匹配的任何行。因此,只需开始输入 'hammer',它就会将行过滤为只有一个。