Нет ли у уважаемого сообщества простейшего примера связки джанго и jqgrid?
from django.db import models # Create your models here. class SomeFancyModel(models.Model): name = models.CharField(max_length=64) desc = models.CharField(max_length=64)
from django.conf.urls import patterns, include, url from django.contrib import admin from jqgt.views import * admin.autodiscover() urlpatterns = patterns('', # Examples: # url(r'^$', 'jqg.views.home', name='home'), # url(r'^blog/', include('blog.urls')), url(r'^examplegrid/$', grid_handler, name='grid_handler'), url(r'^examplegrid/cfg/$', grid_config, name='grid_config'), url(r'^gr/$', test_grid, name='test_grid'), )
from django.shortcuts import render from django.shortcuts import * from django.http import HttpResponse from django.contrib.auth import * from grids import * # Create your views here. def grid_handler(request): # handles pagination, sorting and searching grid = ExampleGrid() return HttpResponse(grid.get_json(request), mimetype="application/json") def grid_config(request): # build a config suitable to pass to jqgrid constructor grid = ExampleGrid() return HttpResponse(grid.get_config(), mimetype="application/json") def test_grid(request): return render_to_response('base.html')
from jqgrid import * from django.core.urlresolvers import * from jqgt.models import * class ExampleGrid(JqGrid): model = SomeFancyModel # could also be a queryset fields = ['id', 'name', 'desc'] # optional url = reverse_lazy('grid_handler') caption = 'My First Grid' # optional colmodel_overrides = { 'id': { 'editable': False, 'width':10 }, }
<!DOCTYPE html> <html> <head> <title>Jqtest</title> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/redmond/jquery-ui.css" rel="stylesheet" type="text/css"/> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" /> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <link rel="stylesheet" type="text/css" href="css/ui.jqgrid.css"/> <script type="text/javascript" src="src/grid.loader.js"></script> <script type="text/javascript"> $(function () { $.getJSON("{% url "grid_handler" %}", function(data){ $("#mygrid") .jqGrid(data) .navGrid('#pager', {add: false, edit: false, del: false, view: true}, {}, // edit options {}, // add options {}, // del options { multipleSearch:true, closeOnEscape:true }, // search options { jqModal:false, closeOnEscape:true} // view options ); }); }); </script> </head> <body> <table id="mygrid"></table> <div id="pager"></div> </body> </html>
$.getJSON("{% url "grid_handler" %}", function(data){
$.getJSON("{% url "grid_config" %}", function(data){
<link rel="stylesheet" type="text/css" href="{% static 'jquery/css/redmond/jquery-ui-1.10.4.custom.min.css' %}" /> <link rel="stylesheet" type="text/css" href="{% static 'jquery.jqGrid/css/ui.jqgrid.css' %}" /> <link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}" /> <script type="text/javascript" src="{% static 'jquery/js/jquery-1.10.2.js' %}"></script> <script type="text/javascript" src="{% static 'jquery/js/jquery-ui-1.10.4.custom.min.js' %}"></script> <script type="text/javascript" src="{% static 'jquery/js/jquery.cookie.js' %}"></script> <script type="text/javascript" src="{% static 'jquery.jqGrid/js/i18n/grid.locale-en.js' %}"></script> <script type="text/javascript" src="{% static 'jquery.jqGrid/js/jquery.jqGrid.min.js' %}"></script>
<!DOCTYPE html> <html> <head> {% load staticfiles %} <title>Jqtest</title> <link rel="stylesheet" type="text/css" href="{% static 'jquery/css/ui-lightness/jquery-ui-1.10.4.min.css' %}" /> <link rel="stylesheet" type="text/css" href="{% static 'jquery.jqGrid/css/ui.jqgrid.css' %}" /> <script type="text/javascript" src="{% static 'jquery/js/jquery-1.10.2.js' %}"></script> <script type="text/javascript" src="{% static 'jquery/js/jquery-ui-1.10.4.min.js' %}"></script> <script type="text/javascript" src="{% static 'jquery.jqGrid/js/i18n/grid.locale-en.js' %}"></script> <script type="text/javascript" src="{% static 'jquery.jqGrid/js/jquery.jqGrid.min.js' %}"></script> <script type="text/javascript"> $(function () { $.getJSON("{% url "grid_config" %}", function(data){ $("#mygrid") .jqGrid(data) .navGrid('#pager', {add: false, edit: false, del: false, view: true}, {}, // edit options {}, // add options {}, // del options { multipleSearch:true, closeOnEscape:true }, // search options { jqModal:false, closeOnEscape:true} // view options ); }); }); </script> </head> <body> <table id="mygrid"></table> <div id="pager"></div> </body> </html>