煎茶触摸搜索表答案

【问题标题】：sencha touch search form煎茶触摸搜索表
【发布时间】：2011-06-26 17:21:19
【问题描述】：

我真的希望有人可以帮助我，看起来这应该很明显，但是 sencha 文档不是很容易阅读且不完整。我正在尝试构建一个搜索表单，但它似乎没有使用商店或 url，我不知道如何添加页面等参数？任何人都可以帮忙吗？这段代码只会产生 Failed to load resource: null。

        var searchField = new Ext.form.Search({
            value:'Search',
            url: 'someurl',
            store: this.data_store,
            cls:'searchfield',
            listeners: {
                focus: function(){ searchField.setValue(''); },
                blur: function(){ if( searchField.getValue()=='' ){ searchField.setValue('Search'); } },
                success: function(e){
                    console.log(e);
                }
            }
        });

   this.dockedItems = [ searchField ];

【问题讨论】：

标签： sencha-touch

【解决方案1】：

Ext.form.FormPanel 不直接采用Ext.data.Store 或Ext.data.Model，而是处理Ext.data.Model 的实例。假设您有以下模型：

Ext.regModel('MyForm', {
    fields: [{name: 'id', type: 'int'},'name','description']
    proxy: {
    type: 'ajax',
        url: 'url_to_load_and_save_form'
    }
})

现在您的表单定义将如下所示：

Ext.form.MyForm = Ext.extend(Ext.form.FormPanel, {
    record : null,
    model: 'MyForm',

    items: [{
        xtype: 'hidden',
        name: 'id' 
    },{
        xtype: 'textfield',
        name: 'name',
        allowBlank: false
    },{
        xtype: 'textarea',
        name: 'description'
    }],
    submit : function(){
        var record = this.getRecord() || Ext.ModelMgr.create({}, this.model);
        this.updateRecord(record , true);
        record.save({
            scope: this,
            success : function(record, opts){
                this.fireEvent('saved', record);
            },
            callback: function(){
                this.setLoading(false);
            }
        });
    }
});
Ext.reg('MyForm',Ext.form.MyForm);

当然，您应该添加一些验证和一个按钮来实际调用Ext.form.MyForm.submit 方法。

【讨论】：