0

我正在使用jsGrid（Grid jQuery Plugin）以表格格式显示数据，下面是我拥有的代码

<script>
    $(function() {

        $("#jsGrid").jsGrid({
            height: "70%",
            width: "100%",
            filtering: true,
            editing: true,
            inserting: true,
            sorting: true,
            paging: true,
            autoload: true,
            pageSize: 15,
            pageButtonCount: 5,
            deleteConfirm: "Do you really want to delete the client?",
            controller: db,
            fields: [
                { name: "Name", type: "text", width: 150 },
                { name: "Age", type: "number", width: 50 },
                { name: "Address", type: "text", width: 200 },
                { name: "Country", type: "select", items: db.countries, valueField: "Id", textField: "Name" },
                { name: "Married", type: "checkbox", title: "Is Married", sorting: false },
                { type: "control" }
            ]
        });

    });
</script>

它从服务或文件中获取数据db.js，如下所示

db.countries = [
    { Name: "", Id: 0 },
    { Name: "United States", Id: 1 },
    { Name: "Canada", Id: 2 },
    { Name: "United Kingdom", Id: 3 },
    { Name: "France", Id: 4 },
    { Name: "Brazil", Id: 5 },
    { Name: "China", Id: 6 },
    { Name: "Russia", Id: 7 }
];

db.clients = [
    {
        "Name": "Otto Clay",
        "Age": 61,
        "Country": 6,
        "Address": "Ap #897-1459 Quam Avenue",
        "Married": false
    },
    {
        "Name": "Connor Johnston",
        "Age": 73,
        "Country": 7,
        "Address": "Ap #370-4647 Dis Av.",
        "Married": false
    },
    {
        "Name": "Lacey Hess",
        "Age": 29,
        "Country": 7,
        "Address": "Ap #365-8835 Integer St.",
        "Married": false
    }];

我想从像 MS SQL Server 这样的数据源将数据传递给它，我们该怎么做？

4

1 回答 1

1

您的网格是否适用于来自 db.js 的上述静态数据？如果是这样，那么它不是关于 jsGrid 而是更多关于 SQL 和 Web 服务。基本上，您需要创建一个 Web 服务来查询您的 SQL 数据库并为您的 jsGrid 返回一组数据。

对 Web 服务的调用可以在loadData控制器中。该文档显示了一个简单的示例。下面是一个使用 Promise 的类似示例，其中/api/data对 Web 服务的 Ajax 调用必须以静态文件返回的形式返回数据：

 ...
 controller: {
   loadData: function(filter) { 
               return $.getJSON("/api/data/"
                ).done(function(results) {
                    console.log(results);
               }).fail(function(err) {
                     alert(err));
                  }); 
     },
 },
 ...

您可能希望从简单开始并暂时避免分页以测试获取数据是否有效。分页需要更复杂的查询，还需要返回结果中的记录总数。从文档中：

dataResult取决于pageLoading. 如果pageLoading为 false（默认情况下），则数据结果是一个纯 JavaScript 对象数组。如果pageLoading为真数据结果应具有以下结构：

{
   data          // array of items
   itemsCount    // total items amount in storage
}
于 2017-05-02T03:07:43.973 回答