如何從數據庫加載數據到組合框（自動完成）

有時候，在jQuery中很容易理解和實現的東西可能需要很長時間才能在ExtJS中完成，儘管ExtJS確實是一個很好的庫。我正在嘗試做的是創建一個具有自動完成功能的組合框。如何從數據庫加載數據到組合框（自動完成）

使用本地商店非常簡單。

首先，我創建存儲：

var searchOptions = Ext.create('Ext.data.Store', { 
    fields: ['abbr', 'name'], 
    data: [{ 
     "name": "Value1" 
    }, { 
     "name": "Value2" 
    }] 
});

然後，我創建的組合框這樣：

{ 
    xtype: 'combo', 
    displayField: 'name', 
    fieldLabel: 'Insert NodeId', 
    labelAlign: 'right', 
    width: 200, 
    margin: 5, 
    id: 'nodeId', 
    valueField: 'id', 
    store: searchOptions, 
    queryMode: 'local', 
    minChars: 1, 
    hideTrigger: true, 
    forceSelection: true, 
    typeAhead: true, 
    listeners: { 
     render: function() { 
      this.store.load(); 
     } 
    } 
}

現在我想做的就是運行這個偏遠而不是局部的。如果我理解正確，我需要發送一個Ajax請求，從我的postgresql數據庫獲取數據，然後什麼？我在哪裏存儲數據？是否有可能將他們放入商店，如果是，我如何定義商店的形式？

任何幫助或例子將主要讚賞。

謝謝。

來源

2015-03-31 user1919

他們有各種各樣的例子和一個偉大的文檔。您應該查看數據包。 – hazimdikenli 2015-04-01 11:05:16

經過一些在互聯網搜索和在這個post的幫助下，我設法使其工作。

這是我做過什麼：

首先，我創建了一個店，如：

var autoCompleteStore = new Ext.data.JsonStore({ 
    fields:['onomasia'], 
    proxy: new Ext.data.HttpProxy({ 
     url: 'autocomplete/getautocomplete.php', 
      method: 'POST' 
     }), 
    baseParams:{task: "onomasia"}  
});

然後創建一個組合框：

// DEFINE THE COMBO BOX FOR THE AUTOCOMPLETE 
var nodeOikismoiField = new Ext.form.ComboBox({ 
    id:'nodeId', 
    name: 'oikismos', 
    fieldLabel: 'Insert NodeId', 
    displayField: 'onomasia', 
    store: autoCompleteStore, 
    mode: 'remote', 
    allowBlank: false, 
    valueField: 'onomasia', 
    anchor:'95%', 
    triggerAction: 'all', 
    labelAlign : 'right', 
    width: 200, 
    margin: 5, 
    minChars:1 
});

我叫裏面的組合框我視。

最後我getautocomplete.php文件看起來像這樣：

<?php 
    include 'postgresConnect.php'; 

    $query = "SELECT onomasia FROM oikismoi_covered LIMIT 3"; 
    $resultImg = pg_query($dbconn, $query); 
    $json = array(); 

    while ($oikismos = pg_fetch_row($resultImg)) { 
     $json[] = array(
      'onomasia'=> $oikismos[0] 
     ); 
    } 

    echo json_encode($json); 
?>

我希望這可以幫助別人的未來。

來源

2015-04-01 08:15:46 user1919

您需要做的第一件事是使用可以加載遠程數據的代理配置searchOptions存儲。它應該有一個指向加載數據的服務的URL。像

proxy : { 
    type : 'rest', 
    url  : '/api/service/users', 
    reader : { 
     type : 'json', 
     root : 'users' 
    } 
}

東西，如果你配置服務進行過濾是基於一個名爲query，那麼你可以鏈接組合框，並自動完成的查詢參數值。請求應該看起來像http://domain.com/api/service/users?query=Frank。

在將combobox queryMode設置爲'remote'（或者因爲remote是默認設置而將其刪除）之後，無論輸入什麼值都應該使用query參數中的值發送到存儲代理url。

來源

2015-03-31 17:51:39 cpastore84

如何從數據庫加載數據到組合框（自動完成）

回答

相關問題