在extjs中爲組合框中的選定值獲取相關ID

我實現了一個ExtJs組合框。在extjs中爲組合框中的選定值獲取相關ID

new Ext.form.ComboBox({ 
     store : vehicleStore, 
     displayField : 'vRegNum', 
     valueField : 'vRegNum', 
     fieldLabel : 'Vehicles', 
     id : 'vehicleCombo', 
     typeAhead : true, 
     forceSelection : true, 
     mode : 'local', 
     triggerAction : 'all', 
     selectOnFocus : true, 
     editable : true, 
     hidden : false, 
     //xtype : 'combo', 
     minChars : 1, 
     hideLabel : true, 
     style : 'marginleft:10px', 
     listeners : { 
      select : function() { 
      } 

     }, 
     //width : 147, 
     emptyText : 'Delivery Vehicle' 
     //flex : 1 
    })

而且我使用Json從postgresql數據庫加載這個組合。

var vehicleStore = new Ext.data.JsonStore({ 
fields : [ { 
    id : 'vCode' 
}, { 
    name : 'vRegNum' 
} ], 
root : 'vehicles', 
//autoDestroy : true, 
autoLoad : true, 

proxy : new Ext.data.HttpProxy({ 
    url : "http://" + host + ":" + port + "/" + projectName + "/" 
      + "DeliveryVehicle" 

}), 
reader : { 
    type : 'json', 
    root : 'vehicles' 
}, 
});

這是我的DeliveryVehicle.java servlet。

//imports 
public class DeliveryVehicle extends HttpServlet { 
private static final long serialVersionUID = 1L; 

/** 
* @see HttpServlet#HttpServlet() 
*/ 
public DeliveryVehicle() { 
    super(); 
    // TODO Auto-generated constructor stub 
} 

@Override 
public void init() throws ServletException { 
    // TODO Auto-generated method stub 
    super.init(); 
} 

/** 
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse 
*  response) 
*/ 
protected void doGet(HttpServletRequest request, 
     HttpServletResponse response) throws ServletException, IOException { 
    processRequest(request, response); 
} 

/** 
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse 
*  response) 
*/ 
protected void doPost(HttpServletRequest request, 
     HttpServletResponse response) throws ServletException, IOException { 
    processRequest(request, response); 
} 

protected void processRequest(HttpServletRequest request, 
     HttpServletResponse response) throws ServletException, IOException { 
    response.setContentType("text/html;charset=UTF-8"); 
    PrintWriter out = response.getWriter(); 

    ServletContext context = getServletContext(); 

    String dbName = context.getInitParameter("ConnectionDB"); 
    String connectionHost = context.getInitParameter("ConnectionHost"); 
    String connectionUser = context.getInitParameter("ConnectionUser"); 
    String connectionPassword = context.getInitParameter("ConnectionPassword"); 
    String port = "5433"; 

    Statement statement = null; 
    ResultSet vehicleResultSet = null; 
    Connection pgConnection = null; 
    //String lineString = ""; 

    try { 
     pgConnection = ConnectionManager.getPostgresConnection(
       connectionHost, connectionUser, connectionPassword, 
       dbName, port); 
     //out.println(connectionHost+","+ connectionUser+","+ connectionPassword+","+ dbName); 
     statement = pgConnection.createStatement(); 
     //out.print(pgConnection); 

     String sql = ""; 


     sql = "select vehiclecode, registrationnumber from hoobtvehicles v WHERE v.status='1'"; 

     vehicleResultSet = statement.executeQuery(sql); 

     String jsonData = "{'vehicles':["; 

     while (vehicleResultSet.next()) { 
      jsonData += "{ 'vCode' : '"; 
      jsonData += vehicleResultSet.getString(1).trim(); 
      jsonData += "', "; 
      jsonData += "'vRegNum' : '"; 
      jsonData += vehicleResultSet.getString(2).trim(); 

      if (vehicleResultSet.isLast()) { 
       jsonData += "' } "; 
      } else { 
       jsonData += "' } , "; 
      } 
     } 

     jsonData += "]}"; 
     out.print(jsonData); 

    } catch (Exception e) { 
     // TODO Auto-generated catch block 
     out.println(e.toString()); 
     e.printStackTrace(); 

    } 

} 

}

我的Json數據如下。

{'vehicles':[{ 'vCode' : '1001', 'vRegNum' : 'XY-100-123' } , { 'vCode' : '1002', 'vRegNum' : 'GY-122-120' } , { 'vCode' : '1000000001', 'vRegNum' : 'XY-100-123' } ]}

我的combobox加載正常。現在我需要在用戶選擇特定的vRegNum時獲得相關的vode。

任何建議表示讚賞。

Thanx提前

來源

2014-01-07 Rose18

嘗試在組合框配置中使用'valueField：'vCode''。顯示值仍然是基於displayField配置的'vRegNum'，但組合將返回'vcode'作爲值。 – Akatum

我試過了。然後組合框始終將第一個vName作爲其值。 – Rose18

如果我使用valueField：'vCode'，那麼我不能選擇組合框值。它總是將第一個vName作爲其值。那我該怎麼辦？ – Rose18

試試這個（修改基於此片段的代碼），讓我知道結果（我知道，我總是寫這句話，但我不知道你在你的環境中獲得）

items: [ 
{ 
    xtype: 'combobox', 
    fieldLabel: 'CTG ALANI', 
    id: 'ctg-main', 
    inputWidth: 467, 
    fieldStyle: 'height: 26px', 
    margin: '15 5 0 0', 
    valueField: 'CUST_ASSORT_SECTION_ID', 
    displayField: 'CTG_SECTION', 
    store: ctgSection, 
    queryMode: 'local', 
    autoSelect: true, 
    forceSelection: true, 
    triggerAction: 'all', 
    listeners: { 
     select: function (combo) { 
      ctgDescription.proxy.extraParams = {'ctgmain': combo.getValue(), 'type': 'ctg_desc'}; 
      ctgDescription.removeAll(); 
      ctgDescription.load(); 
     } 
    } 
},

這裏是，組合框的重要部分getValue()方法。如果您只想要組合框的原始值，只需嘗試getRawValue()方法。

來源

2014-01-07 10:48:35

在extjs中爲組合框中的選定值獲取相關ID

回答

相關問題