2

我正在开发 Extjs 4.1。我确实为文本框实现了自动完成功能。我现在可以通过输入一个术语来搜索学生的名字或姓氏，例如：Mat，文本字段中的结果将是：

Mathio,Jay << student's first and last name

Mark,Matt << student's first and last name

然后，我对查询进行了一些更改，以便在搜索主题时也可以获取主题：

Mathio,Jay << 学生的名字和姓氏

Mark,Matt << 学生的名字和姓氏

数学<<科目

这是我的新查询： 查询在多个表中搜索 + 指定返回值

现在，我需要重新配置其他部分，以便该字段可以同时显示案例、名称和主题

这是我的组合配置：

,listConfig: {
loadingText: 'Loading...',
tpl: Ext.create('Ext.XTemplate',
    '<tpl for=".">',
        '<tpl if="l_name.length == 0"> ',             
           '<div class="x-boundlist-item">{f_name}<p><font size="1">Last Name: Unknown </font></p></div>',
        '<tpl else>',
           '<div class="x-boundlist-item">{f_name}<p><font size="1">{l_name}</font></p></div>',
        '</tpl>',
    '</tpl>'
),

和我的模型：

     Ext.define("auto", {
        extend: 'Ext.data.Model',
           proxy: {
         type: 'ajax',
        url: 'auto.php',
        reader: {
            type: 'json',
            root: 'names',

        autoLoad: true,
            totalProperty: 'totalCount'
        }
    },

    fields: ['f_name','l_name'
, {
                    name : 'display',
                    convert : function(v, rec) {                        
                        return rec.get('f_name') + ',' + rec.get('l_name');
                    }
                }
    ]
    });

我尝试了很多次，但仍然无法找到一个好的方法来做到这一点。

4

1 回答 1

2

IMO，您最好使用只有“名称”字段的简单模型，并在服务器端填充此字段。根据您之前的问题，服务器代码看起来像（在您的查询处理循环中）：

if (isset($row[2])) { // if the query returned a subject name in the row
    $name = 'Subject: ' . $row[2];
} else if (isset($row[1])) { // if we have the last name
    $name = 'Student: ' . $row[0] . ', ' . $row[1];
} else { // we have only the first name
    $name = 'Student: ' . $row[0] . ' (Uknown last name)';
}

$names[] = array(
    'name' => $name,
);

在客户端，您将使用具有单个名称字段的模型，并相应地配置您的组合框：

// Your simplified model
Ext.define('Post', {
    extend: 'Ext.data.Model'
    ,fields: ['name']
    ,proxy: {
        // Your proxy config...
    }
});

Ext.widget('combo', {
    displayField: 'name'
    ,valueField: 'name'
    // Remaining of your combo config...
});

但是，如果您真的想在一个模型中混合学生和科目数据，那么您应该对当前代码进行以下修改。首先，您需要从服务器检索主题名称。这意味着将您的服务器代码更改为：

$names[] = array('f_name' => $row[0], 'l_name' => $row[1], 'subject' => $row[2]);

然后您需要在客户端的模型中添加此字段，并调整显示字段的转换方法以考虑主题：

Ext.define('Post', {
    extend: 'Ext.data.Model'
    ,fields: ['f_name', 'l_name', 
        'subject', // Add the subjet field to the model
        {
            name: 'display'
            // Adjust your convert method
            ,convert: function(v, rec) {
                var subject = rec.get('subject'),
                    lastName = rec.get('l_name'),
                    firstName = rec.get('f_name');
                if (!Ext.isEmpty(subject)) {
                    return subject;
                } else {
                    if (Ext.isEmpty(lastName)) {
                        return firstName + ' (Unknown last name)';
                    } else {
                        return firstName + ', ' + lastName;
                    }
                }
            }
        }
    ]
    ,proxy: {
        // Your proxy config...
    }
});

最后，由于您已经在模型的显示字段中完成了这项工作，因此您应该将其用作组合的显示字段，而不是在组合的模板中再次执行此操作。

例如组合配置：

{
    displayField: 'display'
    ,valueField: 'display'
    // Remaining of your combo config...
}
于 2013-05-15T16:02:04.667 回答