extjs 4：通过PHP脚本使用MYSQL db填充组合框

Question

Hello i'm trying to populate a combobox with data coming from MYSQL database. Using Extjs 4 with the MVC architecture.

Here's the combobox configuration within my view :

         ...
         {
            xtype: 'combobox',
            id: 'cmbMetric',
            name: 'metr',
            mode: 'queryMode',
            querymode : 'lcoal',
            fieldLabel: 'Metric',
            store: 'MetricsData',
            editable: false,
            valign : 'middle',
            margin : 15

        }
        ....

My store :

Ext.define('Metrics.store.MetricsData', {
extend: 'Ext.data.Store',
model: 'Metrics.model.MetricsData',
autoLoad: true,
proxy : {
    type : 'ajax',
    actionMethods : 'POST',
    api : {
    read : 'testmysql.php'
    },
    reader: {
        type: 'json',
        successProperty: 'success',
        messageProperty: 'message',
        root: 'data'
    }
}
});

My model :

Ext.define('Metrics.model.MetricsData', {
extend: 'Ext.data.Model',
fields: [{name : 'name_metric'}]    
});

Finally my PHP script :

<?php   

//database parameters
$user='user'; 
$pw='';
$db='mydb';
$table='metric';

//make database connection
$connection = mysql_connect("localhost", $user, $pw) or
die("Could not connect: " . mysql_error());
mysql_select_db($db) or die("Could not select database");

metricsName();

function metricsName() 
{
$sql = 'SELECT name_metric FROM metric';

$result = mysql_query($sql); // result set

while($rec = mysql_fetch_array($result, MYSQL_ASSOC)){
    $arr[] = $rec;
};

$data = json_encode($arr);  //encode the data in json format

}

?>

I don't know what's wrong or where the error is coming from, but my combobox is never filled. Any help would be much appreciated.

Answer 1

You need to return echo the $data at the end.

$data = json_encode($arr);  //encode the data in json format
echo $data;

Also your returned data should look something like this:

{
    data: [{ 
              name_metric: 'record1' 
          }, { 
              name_metric: 'record2' 
          }],
    total: 2,
    success: true
}

Answer 2

Two things:

• Ext seems to like it when you define an id property/field, it defaults to id. You should add the primary key to your sql query and return it in the data either aliased to or named "id", or change the idProperty of the proxy to match the name you send.
• ExtJS expects your json to be in a format something like this given how you have that proxy defined

   { \n    "success": true, \n    "message": "OK", \n    "data": [ \n        { \n            "id": 1, \n            "name_metric": "Value1" \n        }, \n        { \n            "id": 2, \n            "name_metric": "Value2" \n        } \n    ] \n}  

  That means that your function should return just the data array, rather than the encoded one, and php should output should go something like this:

   echo json_encode(array( \n        'success' => true, \n        'message' => "OK", \n        'data' => metricsName() \n));  

• Finally, the combo box definition is off. You need to provide at least a valueField definition and create an instance of the store rather than passing it's name

   { \n    xtype: 'combobox', \n    store: Ext.create("Metrics.store.MetricsData"), \n    displayField: 'name_metric', \n    valueField: 'id' \n} \n\n