ExtJS gridPanel未加载JSON
我在这里按照教程： http://www.sencha.com/learn/Tutorial:Grid_PHP_SQL_Part3
但是我无法加载我的gridPanel。我一直在努力解决这个问题已经有一段时间了，我不断改变我的代码并且没有任何工作。我可以看到，如果我查看FireBug，JSON会加载，是的，我尝试过禁用FireBug，但我还没有运气......
我已经按照上面的教程，引用了ExtJS Cookbook，并查看了Sencha网站上的各种示例和API文档。
感谢您的帮助，非常感谢，
elshae
PHP代码：
function getList()
{
global $DBConnect;
$place_name_result = @pg_query($DBConnect, "SELECT place_names.location, place_names.name, language.name AS language, place_names.transliteration,
place_names.english_translation, place_names.place_group, place_names.located_true, place_names.id AS place_names_id, category.name AS category,
category.id AS category_id FROM place_names, place_location, category,
language WHERE place_names.location = place_location.id AND place_location.category = category.id AND place_names.language = language.id;");
$number_of_rows = pg_num_rows($place_name_result);
if( $number_of_rows > 0 ){
$place_names = array("total" => $number_of_rows, "results" => array());
$i = 0;
while (($place_name_records = pg_fetch_row($place_name_result)) && ($i < 100)) {
//$place_names[] = $place_name_records;
$place_names['results'][$i] = $place_name_records;
$i++;
}
$jsonresult = JEncode($place_names);
//echo '({"total":"'.$number_of_rows.'","results":'.$jsonresult.'})';
//echo '{"total":'.$number_of_rows.',"results":'.$jsonresult.'}';
echo $jsonresult;
} elseif( $number_of_rows = 0 ) {
echo '({"total":"0", "results":""})';
} elseif(!$place_name_result){
echo "An error occurred upon getting data from the place_names, place_location and category tables.\n";
exit;
}
}//End getList()
function JEncode($arr){
if (version_compare(PHP_VERSION,"5.2","<"))
{
require_once("./JSON.php"); //if php<5.2 need JSON class
$json = new Services_JSON(); //instantiate new json object
$data=$json->encode($arr); //encode the data in json format
} else
{
$data = json_encode($arr); //encode the data in json format
}
return $data;
}//End JEncode($arr)
//getList();
$task = '';
if (isset($_POST['task']) ){
$task = $_POST['task']; // Get this from Ext
}
switch($task){
case "LISTING": // Give the entire list
getList();
break;
default:
echo "{failure:true}"; // Simple 1-dim JSON array to tell Ext the request failed.
break;
}
JS代码：
var placeNamesDataStore;
var placeNamesColumnModel;
var placeNamesListingEditorGrid;
var placeNamesListingWindow;
Ext.BLANK_IMAGE_URL = "../ext-3.3.1/resources/images/default/s.gif";
/*placeNamesDataStore = new Ext.data.JsonStore({
storeId: 'placeNamesDataStore',
url: 'tibetTestAdmin.php', // File to connect to
//method: 'POST',
baseParams: {task: "LISTING"}, // this parameter asks for listing
// we tell the datastore where to get data from
root: 'results',
totalProperty: 'total',
idProperty: 'place_names_id',
fields: [
{name: 'location', type: 'int', mapping: 'location'},
{name: 'name', type: 'string', mapping: 'name'},
{name: 'language', type: 'string', mapping: 'language'},
{name: 'transliteration', type: 'string', mapping: 'transliteration'},
{name: 'english_translation', type: 'string', mapping: 'english_translation'},
{name: 'place_group', type: 'int', mapping: 'place_group'},
{name: 'located_true', type: 'bool', mapping: 'located_true'},
{name: 'place_names_id', type: 'int', mapping: 'place_names_id'},
{name: 'category', type: 'string', mapping: 'category'},
{name: 'category_id', type: 'int', mapping: 'category_id'}
],
sortInfo:{field: 'place_names_id', direction: "ASC"}
});*/
Ext.onReady(function(){
Ext.QuickTips.init();
placeNamesDataStore = new Ext.data.Store({
id: 'placeNamesDataStore',
proxy: new Ext.data.HttpProxy({
url: 'tibetTestAdmin.php', // File to connect to
method: 'POST'
}),
baseParams: {task: "LISTING"}, // this parameter asks for listing
reader: new Ext.data.JsonReader({
// we tell the datastore where to get data from
root: 'results',
totalProperty: 'total',
idProperty: 'place_names_id',
fields: [
{name: 'location', type: 'int', mapping: 'location'},
{name: 'name', type: 'string', mapping: 'name'},
{name: 'language', type: 'string', mapping: 'language'},
{name: 'transliteration', type: 'string', mapping: 'transliteration'},
{name: 'english_translation', type: 'string', mapping: 'english_translation'},
{name: 'place_group', type: 'int', mapping: 'place_group'},
{name: 'located_true', type: 'bool', mapping: 'located_true'},
{name: 'place_names_id', type: 'int', mapping: 'place_names_id'},
{name: 'category', type: 'string', mapping: 'category'},
{name: 'category_id', type: 'int', mapping: 'category_id'}
]}),
sortInfo:{field: 'place_names_id', direction: "ASC"}
});
placeNamesColumnModel = new Ext.grid.ColumnModel(
[{
header: 'Location',
readOnly: true,
dataIndex: 'location', // this is where the mapped name is important!
width: 80,
hidden: false
},{
header: 'Place Name',
dataIndex: 'name',
width: 100,
editor: new Ext.form.TextField({ // rules about editing
allowBlank: false,
maxLength: 100,
maskRe: /([a-zA-Z0-9\s]+)$/ // alphanumeric + spaces allowed
})
},{
header: 'Language',
dataIndex: 'language',
width: 70,
editor: new Ext.form.TextField({
allowBlank: false,
maxLength: 50,
maskRe: /([a-zA-Z0-9\s]+)$/
})
},{
header: 'Transliteration',
dataIndex: 'transliteration',
width: 150,
editor: new Ext.form.TextField({ // rules about editing
allowBlank: false,
maxLength: 150,
maskRe: /([a-zA-Z0-9\s]+)$/ // alphanumeric + spaces allowed
})
},{
header: 'English Translation',
dataIndex: 'english_translation',
width: 200,
editor: new Ext.form.TextField({ // rules about editing
allowBlank: false,
maxLength: 200,
maskRe: /([a-zA-Z0-9\s]+)$/ // alphanumeric + spaces allowed
})
},{
header: "Place Group",
dataIndex: 'place_group',
width: 80,
readOnly: true
},{
header: 'Located True',
dataIndex: 'located_true',
width: 80,
readOnly: true
},{
header: 'Place Names ID',
dataIndex: 'place_names_id',
width: 100,
readOnly: true
},{
header: 'Category',
dataIndex: 'category',
width: 100,
editor: new Ext.form.TextField({ // rules about editing
allowBlank: false,
maxLength: 100,
maskRe: /([a-zA-Z0-9\s]+)$/ // alphanumeric + spaces allowed
})
},{
header: "Category ID",
dataIndex: 'category_id',
width: 70,
readOnly: true,
hidden: true
}
]
);
placeNamesColumnModel.defaultSortable= true;
placeNamesListingEditorGrid = new Ext.grid.EditorGridPanel({
id: 'placeNamesListingEditorGrid',
store: placeNamesDataStore, // the datastore is defined here
cm: placeNamesColumnModel, // the columnmodel is defined here
enableColLock:false,
clicksToEdit:1,
selModel: new Ext.grid.RowSelectionModel({singleSelect:false})
});
placeNamesListingWindow = new Ext.Window({
id: 'placeNamesListingWindow',
title: 'Place Names of points in the Tibetan Autonomous Region',
closable:true,
width:1100,
height:500,
plain:true,
layout: 'fit',
items: placeNamesListingEditorGrid // We'll just put the grid in for now...
});
placeNamesDataStore.load({// store loading is asynchronous, use a load listener or callback to handle results
callback: function(){
Ext.Msg.show({
title: 'Store Load Callback',
msg: 'store was loaded, data available for processing',
modal: false,
icon: Ext.Msg.INFO,
buttons: Ext.Msg.OK
});
}
}); // Load the data
placeNamesListingWindow.show(); // Display our window
});
1 个答案:
答案 0 :(得分：1)
我明白了...原来我的JSON没有为JsonReader正确格式化。我花了一段时间来解决这个问题，因为我的JSON格式是可以接受的，但是对于JsonReader来说却不对。
我有：
{"total":4537,"results":[["3353","\u0f66\u0fa3\u0f44\u0f0b\u0f62\u0fab\u0f7c\u0f44\u0f0b\u0f60\u0f56\u0fb2\u0f74\u0f0b\u0f66\u0fa3\u0f74\u0f58\u0f0b\u0f51\u0f7c\u0f0b\u0f51\u0f58\u0f0b\u0f60\u0f56\u0f56\u0f0b\u0f5a\u0f74\u0f42\u0f66\u0f0d","Tibetan","Nang Dzong Drunum Dodam Baptsuk ","Nang (Lang) County Grain and Oil Management Station","1522","f","3042","Administrative Management Unit","72"]]}
当我需要的是：
{"total":4537,"results":[{"location":"3353","name":"\u0f66\u0fa3\u0f44\u0f0b\u0f62\u0fab\u0f7c\u0f44\u0f0b\u0f60\u0f56\u0fb2\u0f74\u0f0b\u0f66\u0fa3\u0f74\u0f58\u0f0b\u0f51\u0f7c\u0f0b\u0f51\u0f58\u0f0b\u0f60\u0f56\u0f56\u0f0b\u0f5a\u0f74\u0f42\u0f66\u0f0d","language":"Tibetan","transliteration":"Nang Dzong Drunum Dodam Baptsuk ","english_translation":"Nang (Lang) County Grain and Oil Management Station","place_group":"1522","located_true":"f","place_names_id":"3042","category":"Administrative Management Unit","category_id":"72"}]}
这个的PHP代码是：
if( $number_of_rows > 0 ){
$i = 0;
while ($place_name_records = pg_fetch_row($place_name_result)) {
$place_names[$i]['location'] = $place_name_records[0];
$place_names[$i]['name'] = $place_name_records[1];
$place_names[$i]['language'] = $place_name_records[2];
$place_names[$i]['transliteration'] = $place_name_records[3];
$place_names[$i]['english_translation'] = $place_name_records[4];
$place_names[$i]['place_group'] = $place_name_records[5];
$place_names[$i]['located_true'] = $place_name_records[6];
$place_names[$i]['place_names_id'] = $place_name_records[7];
$place_names[$i]['category'] = $place_name_records[8];
$place_names[$i]['category_id'] = $place_name_records[9];
$i++;
}
$jsonresult = json_encode($place_names);
echo '{"total":'.$number_of_rows.',"results":'.$jsonresult.'}';
希望有一天能帮助别人！
干杯，
elshae
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？