Форум сайта python.su
Нет ли у уважаемого сообщества простейшего примера связки джанго и jqgrid?
Отредактировано frostspb (Апрель 28, 2014 11:45:54)
Офлайн
Вообщем. попробовал я использовать пакет django-jqgrid (https://github.com/gerry/django-jqgrid)
на выходе вместо сетки с данными получил абсолютно белую страницу, кто-нибудь может подсказать, что я делаю не так?
models.py
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>
Офлайн
Не сработал или сломался яваскрипт. Хром -> испект элемент -> закладка сеть. Смотрим как реально загружается страница.
Офлайн
Если хочется чтобы grid автоматом по jqGrid(data) стоился, то надо вместо
$.getJSON("{% url "grid_handler" %}", function(data){
$.getJSON("{% url "grid_config" %}", function(data){
Офлайн
Кстати не увидел, где в шаблоне jquery.jqGrid.min.js подключен?
Попробуйте подключить в таком порядке:
<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>
Отредактировано _navi (Апрель 20, 2014 09:50:11)
Офлайн
Однако не получилось
вот мой шаблон , разница с вашими скриптами только в
<script type=“text/javascript” src=“{% static ‘jquery/js/jquery-ui-1.10.4.custom.min.js’ %}”></script>
у меня нет файла query-ui-1.10.4.custom.min.js, есть просто query-ui-1.10.4.min.js'.
на всякий случай приведу текст шаблона
<!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>
Офлайн
На всякий случай спрошу: статика точно попадает в браузер? 404 в консоли не мелькает?
Отредактировано _navi (Апрель 25, 2014 02:11:12)
Офлайн
вообщем всё заработало, проблема была именно в подключении скриптов.
Офлайн
в продолжение темы, а не подскажет ли кто-нибудь как правильно сформировать urledit в jquery для редактирования данных в сетке?
Офлайн