jqGrid没有填充PHP的JSON数据

时间:2013-05-05 03:05:15

标签: php json jqgrid

所有

我一直试图让这一整天都在工作。我认为我的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' );

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

提前谢谢大家

1 个答案:

答案 0 :(得分:0)

好的,既然没有人能够帮助kqGrid,我只是搬到了另一个图书馆。 jqGrid可能会为其他人完美地工作,但这是我第二次想在3年内使用它,至少在我的情况下,让它工作是一种痛苦 - 第一次使用tableToGrid()但这次甚至不是帮助

无论如何,对于那些感兴趣的人,jQuery EasyUI效果很好,设置起来非常简单。

向大家致意。