Question

我正在使用flask，我想使用jqGrid视图，这里是加载数据的代码。

        controller: {
                loadData: function(filter) {
                    var d = $.Deferred();

                    $.ajax({
                        type: "GET",
                        url: "/dashboard",
                        data: filter,
                        dataType: "JSON"
                    }).done(function(result) {
                      d.resolve($.map(result, function(item) {
                         return $.extend(item.fields, { id: item.pk });
                     }));
                    });
                    return d.promise();
                }},

   Here is the .py File

   @app.route("/dashboard")
   @is_logged_in
   def dashboard():

    cur=mysql.connection.cursor()

    result=cur.execute("SELECT * FROM articles")
    articles=cur.fetchall()
    name=json.dumps(articles)
    if result>0:
     return render_template("dashboard.html",articles=articles,name=name)
   else:
     msg="No Article Found"
     return render_template("dashboard.html",msg=msg)
  cur.close()

但网格是空的，我怎么能做到这一点。

Answer 1

首先，将您的查询分解出来。

def query_articles():
  with mysql.connection.cursor() as cur:
    query = "SELECT * FROM articles"
    cur.execute(query)
    articles = cur.fetchall()
  return articles

为返回文章JSON的端点创建一个视图函数。

@app.route("/api/articles", methods=['GET'])
def articles():
     return jsonify(query_articles())

您可以在AJAX请求中使用此端点。

controller: ...
    url: "/api/articles",

另一种方式是在模板中创建一个div节点，以包含序列化的文章列表。

您可以在div中使用此controller来制作网格。

main.py：

from flask import jsonify
from json import dumps



@app.route("/dashboard", methods=['GET'])
@is_logged_in
def dashboard():
    articles = query_articles()
    if len(articles) > 0:
      return render_template(
        "dashboard.html", 
        articles=articles
      )
    return render_template("dashboard.html", msg="No Article Found")

template.html： ... ...

的script.js：

var articles = JSON.parse($('#dataSource').data('articles'));
var articles = articles.map(function(item) {
                return Object.assign({}, item.fields, { id: item.pk });
              });
controller: {
  data: articles
},

如何使用Flask使用jsGrid？

1 个答案: