Альтернатива этому плагину FlexGrid и мне с ней приятней и проще и браузеры все кушает.

Еще расскажи про поиск, очень удобно, я у себя в админке Кинсбурга замутил, все радует

Эх… Убил на ваш сайт минут 20 – пока читал (: Начальник зашёл – пришлось браться за работу… Обязательно вернусь

Раскажите пожалуста как настроить поиск, а то что-то не получается. Кто вообще совершает его, сама таблица или запрос к базе и вывод в таблицу. Спасибо за статьи даже мне чайнику всё дошло!))

Присоединяюсь к просьбе про поиск! и если не трудно, то на примере jqGrid 3.5.1.

Обьясните пожалуйста как сделать таблицу как на примере http://trirand.com/jqgrid/jqgrid.html# таблица Form Navigation?
Когда просто копируешь код он не работает!Мне надо чтоб в таблице были все кнопки работы с таблицей(поиск,ред.добавление и тд).

Прошу прощения за офтоп. Столкнулся с проблемой при работе с данным плагином. Никак не получается при добовлении новой записи отправить файл на сервер. Может кто нибудь сталкивался с подобным ?

А как бы с учётом статьи о загрузке файлов без перезагрузки страницы, научить данный плагин грузить файлы ? Я думаю если данный плагин будет работать ещё и с файлами то цены ему не будет

Прошу прощения за наглость и назойливость. А не могли бы Вы пример описать ? Или подсказать где можно посмотреть подобный пример? Google – не спас.

Здравствуйте! Пробую залить на хостинг, не работает. Причем таблица рисуется, а вот данные не подгружаются. На локалке все работате отлично.

подскажите, не могу разобраться сделать таблицу резиновой?
нужно чтобы таблица была на всю ширину(width: 100%) окна браузера

спасибо, сейчас посмотрю. Но я тут поискал, и нашёл такое решение, с помощью параметра
autowidht: true,

в этом случаи таблица примит ширину окна браузера. Единственное, оно не динамичное, если потом попытаться изменить размеры окна браузера, то таблица будет не измененной, и будет сохранять ту ширину что было при загрузке страницы. В принципе этот вариант неплохой.

Да и вот тут ещё такой вопрос, заметил что Грит теперь использует стили от jQuery-UI, раньше в первых версиях на сколько я помню он не применялся, можно ли как-то избавиться от UI? я бы не хотел тащить такой тяжёлый груз только для таблицы, а использовать свои стили?

спасибо за ответы, на днях я был очень рад гриту, думал что на нём я разверну админ-панель, для своего нового движка, но сегодня когда увидел что почти тоже самое можно сделать и при этом JS код будет не такой огромный как у грита, вот страничка для примера
http://yii.cubedwater.com/user/list

тут есть постраничник, а также сортировка, если нужно то можно и поиск дописать, а редактирование ячеек у таблиц, в принципе не столь и важная часть, хотя это можно сделать немного по другому..

кстати, Владимир, наверняка существуют ещё подобные сайты что я привёл ссылку, где реализована примерно также, не могли бы подсказать ссылки на такие сайты если конечно знаете, было бы интересно посмотреть по изучать как и сам jQuery

кстати, протестировал я тот параметр про который писал выше autowidht: true, оказывается что проблемно будет что-то вывести с правой части от таблици, всё уходит под ниё, так что это не вариант. Но если делать через JS, возможно исправить проблему, но опять же, по коментам там я прочитал высказывания, что есть смещение у последней колонке, так что придётся использовать тот вариант что привёл по ссылке чуть выше, он лёгкий, и кода используется не так много, и встроить прислучаи можно куда угодно и без проблем.

спасибо, да скорее всего jqGrid не для меня, как вы упомянули больше под редактирование полей был предназначен. Лично в моих планах сделать вывод списка в виде таблици, с постраничником+сортировкой при этом должно быть без перезагрузки полной страници.

Приветствую.
Не подскажите как убрать ранее добавленные кнопки ? т.е. мне нужен метод противоположный "navButtonAdd".

Решил
$("#xxxxx").remove();
Главное заранее Id присвоить.
Проверено

Здравствуйте. Попытался сделать как тут: http://www.trirand.com/blog/jqgrid/jqgrid.html раздел Live Data Manipulation ->Navigator

но не получается. В чем ошибка?

код индекса таков:

<link href="themes/basic/grid.css" media="screen" rel="stylesheet" type="text/css">
<link href="themes/jqModal.css" media="screen" rel="stylesheet" type="text/css">
<link href="main.css" media="screen" rel="stylesheet" type="text/css">

<table class="scroll" id="list"></table>
<div class="scroll" id="pager" style="text-align:center;"></div>

Для редактирования сделайте двойной клик на строке

Enter – сохраняет новое значение

Esc – отмена

<script src="jquery-1.3.1.min.js" type="text/javascript"></script>
<script src="jquery.jqGrid.js" type="text/javascript"></script>
<script src="js/min/jqDnR-min.js" type="text/javascript"></script>

<script type="text/javascript">
jQuery(document).ready(function(){
var lastSel;
jQuery("#list").jqGrid({
url:'getdata.php',
datatype: 'json',
mtype: 'POST',
colNames:['№', 'Район', 'Адрес', 'Тип', 'Этаж', 'Этаж-ть', 'Общ', 'Жил', 'Кух', 'В/Сн', 'Угл', 'Тел',

'с/у', 'Ком', 'Б/Л', 'Цена', 'Телефон'],
colModel :[
{name:'id', index:'id', width:25}
,{name:'district', index:'district', width:80, align:'right', editable:true, edittype:"text"}
,{name:'street', index:'street', width:148, align:'right', editable:true, edittype:"text"}
,{name:'level', index:'type', width:32, align:'right', editable:true, edittype:"text"}
,{name:'type', index:'level', width:45, align:'right', editable:true, edittype:"text"}
,{name:'all_level', index:'all_level', width:77, align:'right', editable:true, edittype:"text"}
,{name:'all_place', index:'all_place', width:40, align:'right', editable:true, edittype:"text"}
,{name:'life_place', index:'life_place', width:38, align:'right', editable:true, edittype:"text"}
,{name:'kitchen', index:'kitchen', width:33, align:'right', editable:true, edittype:"text"}
,{name:'bath', index:'bath', width:40, align:'right', editable:true, edittype:"text"}
,{name:'angle', index:'angle', width:30, align:'right', editable:true, edittype:"text"}
,{name:'telefone', index:'telefone', width:30, align:'right', editable:true, edittype:"text"}
,{name:'bathroom', index:'bathroom', width:26, align:'right', editable:true, edittype:"text"}
,{name:'type_room', index:'type_room', width:32, align:'right', editable:true, edittype:"text"}
,{name:'balcony', index:'balcony', width:30, align:'right', editable:true, edittype:"text"}
,{name:'price', index:'price', width:61, align:'right', editable:true, edittype:"text"}
,{name:'firm_telefone', index:'firm_telefone', width:65, align:'right', editable:true,

edittype:"text"}
],
pager: jQuery('#pager'),
rowNum:5,
rowList:[5,10,30],
sortname: 'id',
sortorder: "asc",
viewrecords: true,
imgpath: 'themes/basic/images',
caption: 'Данные пользователей',
ondblClickRow: function(id) {
if (id && id != lastSel) {
jQuery("#list").restoreRow(lastSel);
jQuery("#list").editRow(id, true);
lastSel = id;
}
},
editurl: 'saverow.php'
});
});
jQuery("#list").jqGrid('list','#pagernav',
{}, //options
{height:280,reloadAfterSubmit:false}, // edit options
{height:280,reloadAfterSubmit:false}, // add options
{reloadAfterSubmit:false}, // del options
{} // search options );
</script>

А можно подробней куда это вставлять

jQuery("#list").navGrid('#pager',{edit:false,add:false,del:false,refresh:false,searchtext:"Find"})

.navButtonAdd('#pager',{

caption:"Add", buttonimg:"themes/basic/images/row_add.gif", onClickButton: function(){ alert("Adding Row")}, position:"last"

}).navButtonAdd('#pager',{

caption:"Del", buttonimg:"themes/basic/images/row_del.gif", onClickButton: function(id){ alert("Deleting Row: "+id)}, position:"last"

});

чтоб появились кнопки (добавить удалить итп , ) , потому что я в скриптах ноль

<table class="scroll" id="list"></table>

<div class="scroll" id="pager" style="text-align:center;"></div>

Для редактирования сделайте двойной клик на строке

Enter – сохраняет новое значение

Esc – отмена

Описание этого примера вы найдете в статье: jqGrid: редактирование табличных данных с помощью inline редакторов.

<script src="js/min/jqDnR-min.js" type="text/javascript"></script>

<script src="jquery-1.3.1.min.js" type="text/javascript"></script>

<script src="jquery.jqGrid.js" type="text/javascript"></script>

<script type="text/javascript">

jQuery(document).ready(function(){

var lastSel;

jQuery("#list").jqGrid({

url:'getdata.php',

datatype: 'json',

mtype: 'POST',

colNames:['Id','Логин', 'Фамилия', 'Имя', 'Отчество', 'email', 'Пол', 'Лет' , 'ICQ' , 'Телефон' , 'url', 'Интернет','Группа','Пароль'],

colModel :[

{name:'id', index:'id', width:22}

,{name:'login', index:'login', width:50, editable:true, edittype:"text"}

,{name:'surname', index:'surname', width:70, editable:true, edittype:"text"}

,{name:'fname', index:'fname', width:50, editable:true, edittype:"text"}

,{name:'lname', index:'lname', width:80, editable:true, edittype:"text"}

,{name:'email', index:'email', width:80, editable:true, edittype:"text"}

,{name:'sex', index:'sex', width:60, editable:true, edittype:"text"}

,{name:'age', index:'age', width:35, editable:true, edittype:"text"}

,{name:'ICQ', index:'ICQ', width:50, editable:true, edittype:"text"}

,{name:'phone', index:'phone', width:80, editable:true, edittype:"text"}

,{name:'url', index:'url', width:30, editable:true, edittype:"text"}

,{name:'internet', index:'internet', width:80, editable:true, edittype:"text"}

,{name:'group', index:'group', width:40, editable:true, edittype:"text"}

,{name:'password', index:'password', width:57, editable:true, edittype:"text"}

],

pager: jQuery('#pager'),

rowNum:5,

rowList:[5,10,30],

sortname: 'id',

sortorder: "asc",

viewrecords: true,

imgpath: 'themes/basic/images',

caption: 'Данные пользователей',

ondblClickRow: function(id) {

if (id && id != lastSel) {

jQuery("#list").restoreRow(lastSel);

jQuery("#list").editRow(id, true);

lastSel = id;

}

},

editurl: 'saverow.php'

});

jQuery("#list").navGrid('#pager',{edit:false,add:false,del:false,refresh:false,searchtext:"Find"})

.navButtonAdd('#pager',{

caption:"Add", buttonimg:"themes/basic/images/row_add.gif", onClickButton: function(){ alert("Adding Row")}, position:"last"

}).navButtonAdd('#pager',{

caption:"Del", buttonimg:"themes/basic/images/row_del.gif", onClickButton: function(id){ alert("Deleting Row: "+id)}, position:"last"

});

});

</script>

Мне сложно глядя только на этот код определить, что именно не работает. Если можете, выложите вашу страницу где-нибудь в сети, чтобы можно было firebug'ом посмотреть.