2013-04-19 2 views
1

Я новичок в jqGrid и создал простую сетку с локальными данными с editurl, установленную на clientArray. Я использую встроенную навигацию. Я могу редактировать строку, и когда я нажимаю кнопку сохранения, строки обновляются. Все идет нормально.jqgrid встроенная экономия с clientArray throws error

Когда я нажимаю кнопку добавления строки, вводится новая пустая строка. Когда я ввожу там некоторые данные и нажмите на кнопку Сохранить, я получаю сообщение об ошибке:

Uncaught TypeError: Cannot read property 'extraparam' of undefined jquery.jqGrid.min.js:398

Документация говорит лишь о том, как метод saveRow должен быть вызван. Но, по-видимому, встроенный навигатор вызывает его автоматически. Это прекрасно. Но я думаю, мне все равно нужно правильно установить некоторые параметры, чтобы он не выдавал ошибку и не сохранял вновь добавленную строку.

Надежда какая-то jqGrid гуру имеет хороший совет. Благодарю.

function createTable(data,colNames,colModel,caption){ 
... 

$(table).jqGrid({ data:data, 
         datatype: "local", 
         height: 'auto', 
         colNames:colNames, 
         pager:'#'+pagerid, 
         colModel:colModel, 
         viewrecords: true, 
         caption:caption, 
         editurl:'clientArray', 
         }); 


    var nav = $(table).jqGrid('navGrid','#'+pagerid,{edit:false,add:false,del:false}); 
    $(table).jqGrid('inlineNav','#'+pagerid); 
    $(table).jqGrid('gridResize',{minWidth:350,maxWidth:800,minHeight:80, maxHeight:350}); 
    $('#gbox_'+tableid).draggable(); 
} 
+0

Вы могли бы написать, какую версию jqGrid используете? Вам нужно повторить тест, используя 'jquery.jqGrid.src.js' вместо минимизированной версии' jquery.jqGrid.min.js'. Номер строки в 'jquery.jqGrid.src.js' может быть полезен, но не в jquery.jqGrid.min.js'. Кроме того, было бы полезно, если вы отправляете параметры, если 'createTable', которые вы используете для воспроизведения проблемы. Вы должны понимать, что данные 'colModel: colModel': data' почти совпадают с публикацией кода' myProgram() '. Такой «код» не содержит никакой информации. – Oleg

+0

Привет, Олег, Спасибо за быстрый ответ. Я повторю тест с jquery.jqGrid.src.js, как вы предложили, и сообщите об этом. Тем временем я выяснил, что изменение $ (таблица) .jqGrid ('inlineNav', '#' + pagerid); $ (таблица) .jqGrid ('inlineNav', '#' + pagerid, {edit: true, add: true, editParams: {key: true}, addParams: {addRowParams: {key: true}} }); работает для меня. Сохранение работает даже с editParams: {} и addRowParams: {}, но, конечно, только с кнопкой, а не с ключом. Интересно, почему важно передать пустой объект. – user2297539

+0

@Oleg: console.log (JSON.stringify (data)) дает [{"P0": "строка 0 ячейка 0", "P1": "строка 0 ячейка 1", "P2": "строка 0 ячейка 2" }, {«P0»: «строка 1 ячейка 0», «P1»: «строка 1 ячейка 1», «P2»: «строка 1 ячейка 2»}, {«P0»: «строка 2 ячейка 0», P1 ":" строка 2 ячейка 1 "," P2 ":" строка 2 ячейка 2 "}] console.log (colNames) дает [" P0 "," P1 "," P2 "] console.log (JSON.stringify (colModel)) дает [{"name": "P0", "index": "P0", "width": 150, "editable": true}, {"name": "P1", "index ":" P1 "," width ": 150," editable ": true}, {" name ":" P2 "," index ":" P2 "," width ": 150," editable ": true}] caption is 'the table title' Я тестировал его с помощью jquery.jqgrid.src.js. Я получаю ту же ошибку (l. 9530). – user2297539

ответ

1

Вы правы, это ошибка в методе inlineNav. The lines

if(!o.addParams.addRowParams.extraparam) { 
    o.addParams.addRowParams.extraparam = {}; 
} 

использует o.addParams.addRowParams.extraparam, но значение по умолчанию параметра addParams (см here) определяется как addParams : {}, а не как addParams : {addRowParams: {}}. Таким образом, выражение o.addParams.addRowParams равно undefined, а o.addParams.addRowParams.extraparam - это то же самое, что и undefined.extraparam, которые производят исключение для исключения ссылок.

Я отправил the corresponding bug report в trirand, и проблема будет исправлена ​​в следующей версии jqGrid.

В качестве временного решения можно заменить строку

$(table).jqGrid('inlineNav','#'+pagerid); 

с линией

$(table).jqGrid('inlineNav','#'+pagerid, {addParams: {addRowParams: {}}}); 

Некоторые общие дополнительные замечания к коду:

  • я строго рекомендую вам всегда использовать gridview: true вариант, который улучшит выполнение код вашего кода без каких-либо недостатков
  • Я рекомендую использовать опцию autoencode: true по умолчанию. По умолчанию jqGrid интерпретирует входные данные сетки как фрагменты HTML, которые должны быть хорошо отформатированы. Поэтому, если вы попытаетесь отобразить данные, такие как a < b, у вас могут быть проблемы, потому что < является специальным символом в HTML. Если вы используете опцию autoencode: true, то входные данные будут интерпретироваться как текст вместо фрагментов HTML.
  • Я рекомендую удалить свойство index из вашей модели, если вы всегда назначаете одинаковое значение для index и name.
  • Я рекомендую вам предоставить свойство id с уникальными значениями для каждого элемента входных данных. Вы должны понимать, что jqGrid всегда присваивает атрибут id для каждой строки сетки. Значение должно быть уникальным по всем элементам HTML на странице.Если вы получаете данные с сервера, а данные имеют собственный уникальный id из базы данных, рекомендуется использовать это значение как значение id. Если вы не укажете какое-либо свойство id, jqGrid присвойте значения 1, 2, 3, ... как значения id строк (rowids). Если вы используете больше как один jqGrids на странице и не предоставляете уникальные значения id, вы будете иметь дубликаты id, которые являются ошибкой HTML.
  • Я рекомендую использовать опцию jqGrid idPrefix. Если у вас есть две сетки на странице, и вы не заполняете (и не нуждаетесь) никаких id для элементов данных, тогда у вас есть дубликаты id (id = "1", id = "2" и т. Д. В обеих сетках). Если бы вы определили idPrefix: "g1_" для одной сетки и idPrefix: "g2_" вариант для другой сетки, то строки первой сетки будут id = "g1_1", id = "g1_2" и т. Д. В первой сетке и id = "g2_1", id = "g2_2 "во второй сетке. Даже если вы заполните id с сервера, вы предоставите уникальный идентификатор внутри одной таблицы, но идентификаторы из двух таблиц базы данных могут иметь одинаковый идентификатор. Таким образом, использование различной опции idPrefix для каждой сетки решит проблему дубликатов id очень простым способом.
+0

Да, я принимал мини-ошибку, похожую на ту, что видя, что передача пустого объекта, а не передача его, делает разницу. Спасибо за дополнительные рекомендации. Я буду помнить их при работе с jqgrid. Schoene Gruesse aus Kalifornien. – user2297539

+0

@ user2297539: Добро пожаловать! – Oleg

0

У меня этот же вопрос, но мой jqgrid разметка совершенно другая (возможно, новая версия?)

можно использовать встроенный редактировать и сохранять строку, но добавление строки не спасет. Я не уверен, в чем проблема.

<?php 
ini_set("display_errors","1"); 
require_once 'jq-config.php'; 
// include the jqGrid Class 
require_once ABSPATH."php/jqAutocomplete.php"; 
require_once ABSPATH."php/jqCalendar.php"; 
require_once ABSPATH."php/jqGrid.php"; 
// include the driver class 
require_once ABSPATH."php/jqGridPdo.php"; 
// Connection to the server 
$conn = new PDO(DB_DSN,DB_USER,DB_PASSWORD); 
// Tell the db that we use utf-8 
$conn->query("SET NAMES utf8"); 
// Create the jqGrid instance 
$grid = new jqGridRender($conn); 
// Write the SQL Query 
$grid->SelectCommand = 'SELECT Serial, Type, Customer, Date, Notes FROM rmas'; 

$resize = <<<RESIZE 
jQuery(window).resize(function(){ 
    gridId = "grid"; 

    gridParentWidth = $('#gbox_' + gridId).parent().width(); 
    $('#' + gridId).jqGrid('setGridWidth',gridParentWidth); 
}) 
RESIZE; 
$grid->setJSCode($resize); 

// set the ouput format to json 
$grid->dataType = 'json'; 
$grid->table ="rmas"; 
$grid->setPrimaryKeyId("Serial"); 
// Let the grid create the model 
$grid->setColModel(); 
// Set the url from where we obtain the data 
$grid->setUrl('rmaform.php'); 
$grid->cacheCount = true; 
//$grid->toolbarfilter = true; 
$grid->setGridOptions(array(
    "caption"=>"RMAs", 
    "rowNum"=>50, 
    "sortname"=>"Serial", 
    "hoverrows"=>true, 
    "rowList"=>array(50,100,200), 
    "height"=>600, 
    "autowidth"=>true, 
    "shrinkToFit"=>false 
)); 


$grid->callGridMethod('#grid', 'bindKeys'); 
// Change some property of the field(s) 
$grid->setColProperty("Serial", array("align"=>"center","width"=>40)); 
$grid->setColProperty("Type", array("align"=>"center","width"=>40)); 
$grid->setColProperty("Customer", array("align"=>"center","width"=>65)); 
$grid->setColProperty("Date", array("align"=>"center","width"=>40)); 
$grid->setColProperty("Notes", array("align"=>"left","width"=>500)); 
// navigator first should be enabled 
$grid->navigator = true; 
$grid->setNavOptions('navigator', array("add"=>false,"edit"=>false,"excel"=>true)); 
// and just enable the inline 
$grid->inlineNav = true; 
$buttonoptions = array("#pager", array(
     "caption"=>"Enable Cells", 
     "onClickButton"=>"js:function(){ jQuery('#grid').jqGrid('setGridParam',{cellEdit: true});}", "title"=> "Enable Excel like editing" 
    ) 
); 
$grid->callGridMethod("#grid", "navButtonAdd", $buttonoptions); 
$buttonoptions = array("#pager", array(
     "caption"=>"Disable Cells", 
     "onClickButton"=>"js:function(){ jQuery('#grid').jqGrid('setGridParam',{cellEdit: false});}" , "title"=> "Disable Excel like editing" 
    ) 
); 
$grid->callGridMethod("#grid", "navButtonAdd", $buttonoptions); 
$grid->renderGrid('#grid','#pager',true, null, null, true,true); 
$conn = null; 
?>