2013-05-05 75 views
0

的所有JSON数据。jqGrid未填充来自PHP

我一直试图让这个工作整天。我认为我的JSON数据正在以正确的格式返回,但网格空了。

你可以看到两个网格,这是我打印成字符串按照这个网址的数据:

http://wptest.andrux.net/?p=371

这里是我的PHP代码:

/* connect to the database */ 
    mysql_connect(DB_HOST, DB_USER, DB_PASSWORD) 
     or die('Connection Error: ' . mysql_error()); 

    mysql_select_db(DB_NAME) 
     or die('Error connecting to database ' . DB_NAME); 

    $options = get_option('my-queries'); 

    /* most queries are saved with escaping quotes */ 
    $query = stripslashes($options[ $_POST['id'] ]['query']); 

    $result = mysql_query($query) 
     or die('Couldn\'t execute query. ' . mysql_error()); 

    /* load column names from the database */ 
    $col_names = array(); 
    while ($column = mysql_fetch_field($result)) { 
     $col_names[] = $column->name; 
    } 

    $response->page = 1; 
    $response->total = 1; 
    $response->records = mysql_num_rows($result); 
    $i = 0; 

    while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) { 
     $cells = array(); 
     foreach ($col_names as $col_name) { 
      $cells[] = $row[ $col_name ]; 
     } 
     $response->rows[ $i ]['id'] = $cells[0]; 
     $response->rows[ $i ]['cell'] = $cells; 
     $i++; 
    } 

    echo json_encode($response); 

,这里是我的javascript:

var data = { 
     action: 'build_jqgrid_table', 
     id: 0 
    }; 

$.post('http://wptest.andrux.net/wp-admin/admin-ajax.php', data, function(response) { 
    $('#test-div').html(response); 
}); 


$('#db-query-shortcode-table').jqGrid({ 
    url: 'http://wptest.andrux.net/wp-admin/admin-ajax.php?action=build_jqgrid_table&id=0', 
    datatype: 'json', 
    colNames: [ 
     'Submitted', 
     'changed_address', 
     'cancelled_subscription', 
     'name', 
     'address1', 
     'address2', 
     'city', 
     'state', 
     'zip', 
     'country', 
     'phone', 
     'email', 
     'Submitted_Login', 
     'Submitted_From', 
     'fields_with_file' 
    ], 
    colModel: [ 
     { name: 'Submitted', index: 'Submitted', width: 55, editable: true }, 
     { name: 'changed_address', index: 'changed_address', width: 55, editable: true }, 
     { name: 'cancelled_subscription', index: 'cancelled_subscription', width: 55, editable: true }, 
     { name: 'name', index: 'name', width: 55, editable: true }, 
     { name: 'address1', index: 'address1', width: 55, editable: true }, 
     { name: 'address2', index: 'address2', width: 55, editable: true }, 
     { name: 'city', index: 'city', width: 55, editable: true }, 
     { name: 'state', index: 'state', width: 55, editable: true }, 
     { name: 'zip', index: 'zip', width: 55, editable: true }, 
     { name: 'country', index: 'country', width: 55, editable: true }, 
     { name: 'phone', index: 'phone', width: 55, editable: true }, 
     { name: 'email', index: 'email', width: 55, editable: true }, 
     { name: 'Submitted_Login', index: 'Submitted_Login', width: 55, editable: true }, 
     { name: 'Submitted_From', index: 'Submitted_From', width: 55, editable: true }, 
     { name: 'fields_with_file', index: 'fields_with_file', width: 55, editable: true } 
    ], 
    rowNum: 10, 
    rowList: [ 10, 20, 30 ], 
    pager: '#db-query-pager', 
    sortname: 'Submitted', 
    viewrecords: true, 
    sortorder: 'desc', 
    //editurl: 'server.php', 
    caption: 'Test table' 
}); 

$('#db-query-shortcode-table').jqGrid('navGrid', '#db-query-pager', { edit: false, add: false, del: false }); 
$('#db-query-shortcode-table').jqGrid('inlineNav', '#db-query-pager'); 

任何人谁知道我缺少什么?

谢谢大家提前

回答

0

好了,因为没有人能够帮助kqGrid,我刚搬到另一个库。 jqGrid可能为其他人完美地工作,但这是我3年来第二次使用它,至少在我的情况下,使它工作是一种痛苦 - 第一次使用tableToGrid(),但这一次甚至不是这样帮助。

无论如何,对于那些感兴趣的,jQuery EasyUI工程很好,它很容易设置。

问候大家。

+0

我没有时间测试,但我认为我使用jqGrid的问题可以通过将jqGrid表格封装在iframe中来解决 – andrux 2013-05-07 17:51:08