UIに2つのコンボボックスがあります。最初のコンボボックスには国名のリストが含まれ、2番目のコンボボックスにはその国に存在する州のリストが含まれます。最初のコンボから国を選択すると、名前がサーブレットに送信されます。名前を使用してDBがヒットし、状態名のリストが取得されてJSONObjectに変換されます。現在、このJSONObjectをextjsファイルに戻して、2番目のコンボボックスに状態のリストを入力することができません。
jsファイルのコードは次のとおりです。
Ext.require('Ext.tab.*');
Ext.require('Ext.button.*');
Ext.define('Country',{
extend: 'Ext.data.Model',
fields: [
{ name: 'id', type: 'string' },
{ name: 'name', type: 'string' }
]
});
Ext.define('CountryCombo', {
extend: 'Ext.form.field.ComboBox',
alias: 'widget.countrycombo',
allowBlank: false,
queryMode: 'local',
valueField: 'id',
displayField: 'name',
store: {
model: 'Country',
data: [
{ id: 'China', name: 'China'},
{ id: 'Japan', name: 'Japan'},
{ id: 'Malaysia', name: 'Malaysia'}
]
},
listeners: {
"select": function(obj){
Ext.Ajax.request({
url: '/CellEditing/FormServlet',
method: 'POST',
params: {
data: obj.getValue()
},
success: function(obj){
alert('sucess');
var respText = eval('('+ obj.responseText +')');
alert(respText);
},
failure: function(obj){
alert('failure');
}
});
}
}
});
Ext.define('State',{
extend: 'Ext.data.Model',
fields: [
{ name: 'id', type: 'int' },
{ name: 'name', type: 'string' }
]
});
Ext.define('StateCombo', {
extend: 'Ext.form.field.ComboBox',
alias: 'widget.statecombo',
allowBlank: false,
queryMode: 'local',
valueField: 'id',
displayField: 'name',
store: {
model: 'State',
data:[]
}
});
Ext.onReady(function(){
Ext.tip.QuickTipManager.init();
Ext.widget('panel', {
renderTo: 'pan1',
title: 'Basic Panel',
width:600,
height:100,
defaults: {
bodyPadding: 10,
border: false,
xtype: 'panel',
layout: 'anchor'
},
layout: 'hbox',
items: [{
fieldLabel: 'Country',
xtype: 'countrycombo',
width: 234,
margin: '5 5 5 5'
},{
fieldLabel: 'State',
xtype: 'statecombo',
width: 234,
margin: '5 5 5 5'
}]
});
});
サーブレットは次のとおりです。
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
// TODO Auto-generated method stub
System.out.println("Inside Post");
String selectedValue = req.getParameter("data");
System.out.println(selectedValue);
//This is the json string I want to send back to the UI
//The format of this json is correct, I verifieded it printing in console.
String jsonString = new StateHelper().getStates(selectedValue);
//Below are the lines I am having the doubt, it is not correct.
req.setAttribute("data", jsonString);
req.getRequestDispatcher("combo.jsp").forward(req, resp);
}
combo.jspは、両方のコンボボックスを含むファイルです。このコードを実行すると、「失敗」メッセージを含むアラートが表示されます。
その告げる：この行の構文エラー：
var respText = eval('('+ obj1.responseText +')');
この問題を解決する方法を教えてください。