1

我想将我通过 JSONP 从 Fusion Tables 检索到的一些数据(3 个地址列到 1 个列)合并到 jqGrid 中。

有谁知道这是否可能/如何去做?不幸的是,Fusion Tables SQL API 目前不支持通过 SELECT 命令进行 CONCAT。

如果一列有长数据, Oleg 提供了基本跨列 2 列的代码,但我实际上想从几列中获取数据并将其显示为jqGrid 中的

提前致谢

编辑,添加了一段代码:

datatype: "jsonp", // "json" or "jsonp"
colNames: ["id","lat","long","Name","Address","","","Postcode"],
colModel:[
    {name:'id',index:'id',key:true,sorttype:'int',hidden:true,sortable:true},
    {name:'latitude',index:'latitude',hidden:true},
    {name:'longitude',index:'longitude',hidden:true},
    {name:'name',index:'name',width:170,sortable:false,sorttype:'text'},
    {name:'address_line_1',index:'address_line_1',width:400,formatter:function (cellvalue, options, rowObject) {
        addPart1 = rowObject[4];
        addPart2 = rowObject[5];
        addPart3 = rowObject[6];
        fullAddress = addPart1 + addPart2 + addPart3;
        return fullAddress;},sortable:false,sorttype:'text'},
    {name:'address_line_2',index:'address_line_2',sortable:false,sorttype:'text',hidden:true},
    {name:'address_line_3',index:'address_line_3',sortable:false,sorttype:'text',hidden:true},
    {name:'postcode',label:'postcode',width:80,sortable:false,sorttype:'text'}      
],
jsonReader: {
    cell: "", // the same as cell: function (obj) { return obj; }
    root: "table.rows",
    page: function (obj) { return 1; },
    total: function (obj) { return 1; },
    records: function (obj) { return obj.table.rows.length; }
},

这是来自 .gov 表的通用公共数据示例(我的表基本上是相同的设置)。我稍后会整理问题,以便人们可以轻松地看到问题/答案:)

<script type="text/javascript"> 
var queryText = "SELECT * FROM 185189";
jQuery(document).ready(function() {
    jQuery("#rTable").jqGrid({
        url: 'http://www.google.com/fusiontables/api/query?sql=' +
              encodeURI(queryText) + '&jsonCallback=?',
        postData: "",
        datatype: "jsonp",
        colNames: ["col1","col2","col3","col4"],
        colModel:[
            {name:'FACID',index:'FACID',key:true,sorttype:'int',sortable:true},
            {name:'FACNAME',index:'FACNAME'},
            {name:'FAC_ADDRESS1',index:'FAC_ADDRESS1',sortable:false,sorttype:'text'},
            {name:'FAC_ADDRESS2',index:'FAC_ADDRESS2',sortable:false,sorttype:'text'}
        ],
        jsonReader: {
            cell: "",
            root: "table.rows",
            page: function (obj) { return 1; },
            total: function (obj) { return 1; },
            records: function (obj) { return obj.table.rows.length; }
        },
        rowNum:10,
        rowList:[10,20,30],
        pager: '#pager2',
        sortname: 'name',
        sortorder: "asc",
        viewrecords: true,
        loadonce: true,
        height: "100%",
        multiselect: true,
        caption: ""
    }); // END CREATE GRID
    jQuery("#rTable").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false}); // paging options
});
</script>
4

1 回答 1

0

您可以使用自定义格式化程序根据行的任何输入数据构造列包含。该rowObject参数表示从服务器返回的数据行。自定义格式化程序返回的字符串是将在单元格中显示的文本或 HTML 文本。

如果您遇到实施问题,您应该发布带​​有您使用的融合表的 URL。

更新:您可以用不同的方式解决组合列的问题。第一个与旧版本的 jqGrid 一起使用,只是将formatter函数重写为以下内容:

formatter: function (cellvalue, options, rowObject) {
    var rowObject = arguments[2];
    if ($.isArray(rowObject)) {
        return rowObject[4] + rowObject[5] + rowObject[6];
    } else {
        return rowObject.address_line_1 +
            rowObject.address_line_2 +
            rowObject.address_line_3;
    }
}

该方法的一个小缺点是您将拥有不需要的隐藏列address_line_2address_line_3并且您不会真正使用它们。

更优雅的解决方案是使用新的回调函数(事件)(请参阅我对功能beforeProcessing原始建议)。只有在从服务器加载数据的情况下才会调用该函数。它允许您在jqGrid 处理数据之前修改从服务器返回的数据。在这种情况下,您可以使用默认事件:jsonReader

colNames: ["lat", "long", "Name", "Address", "Postcode"],
colModel:[
    {name: 'latitude', hidden: true},
    {name: 'longitude', hidden: true},
    {name: 'name', width: 170},
    {name: 'address_line', width: 400},
    {name: 'postcode', width: 80}
],
cmTemplate: { sortable: false },
beforeProcessing: function (data) {
    var rows = data.table.rows, length = rows.length, i = 0, row;
    data.page = 1;
    data.total = 1;
    data.records = length;
    data.rows = [];
    for (; i < length; i += 1) {
        row = rows[i];
        data.rows.push({
            id: row[0],
            cell: [row[1], row[2], row[3], row[4] + row[5] + row[6], row[7]]
        });
    }
    delete data.table;
}

我没有你的原始 JSON 数据,也没有测试上面的代码,但代码显示了如何根据服务器返回的原始数据构造新数据。

于 2011-10-27T08:17:51.010 回答