jqGrid - Como é que um jsonreader configure (para uso com Jayrock)?
Pergunta
Gostaria de saber se alguém pode ter algumas dicas sobre isso. jqGrid está muito feliz com este string JSON:
{'page':'1','total':1,'records':'4','rows':[{'id':1,'title':'Story Manager','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'},{'id':2,'title':'Analysis','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'},{'id':3,'title':'Narrative','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'},{'id':4,'title':'Graphic','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'}]}
Jayrock (framework .NET JSON-RPC) fornece a string JSON como:
{id:'-1','result':{'page':'1','total':1,'records':'4','rows':[{'id':1,'title':'Story Manager','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'},{'id':2,'title':'Analysis','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'},{'id':3,'title':'Narrative','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'},{'id':4,'title':'Graphic','assigned':'2009-06-22T10:52:28.0687738-05:00','due':'2009-07-29T10:52:28.0687738-05:00','completed':'2009-07-14T10:52:28.0687738-05:00'}]}}
i. ele adiciona um wrapper "{id:'-1','result':{ /* ... snip ... */ }}
" em torno do JSON trabalhando.
Existe uma maneira de apontar a propriedade jsonReader de jqGrid para o local correto para começar a analisar o resultado JSON? Estou tendo um pedaço de um tempo com tudo isso:)
--- --- editar
Eu queria postar um exemplo rápido ... obrigado pela sua resposta, Stuntz. Tudo que é necessário, por exemplo, o seguinte é .NET, Jayrock , jQuery e jqGrid . Isso funciona com o JSON acima. Eu esqueço se ou não você precisa definir o tipo de conteúdo.
var lastsel; // last row selected (for editing)
jQuery(document).ready(function(){
jQuery("#mygrid").jqGrid({
contentType: "text/plain; charset=utf-8",
datatype: function(postdata)
{
$.ajax({
url: 'http://localhost:2064/StoryManager/StoryManager.ashx/getPageItemRoles?id=3',
data: postdata,
complete: function(response, status)
{
if(status=='success')
{
var mygrid = jQuery("#mygrid")[0];
var o = eval("(" + response.responseText + ")"); // TODO don't use eval. it's insecure, but older browsers support it...
mygrid.addJSONData(o.result);
}
}
})
},
colNames:['ID', 'Title', 'Assigned To', 'Assigned', 'Due', 'Completed'],
colModel:[
{name:'id', label:'ID', jsonmap:'id', hidden: true, editrules: { edithidden: true }},
{name:'title', jsonmap:'title', editable: true},
{name:'assignedto', label:'Assigned To', jsonmap:'assignedto', editable: true},
{name:'assigned', jsonmap:'assigned', editable: true},
{name:'due', jsonmap:'due', editable: true},
{name:'completed', jsonmap:'completed', editable: true}
],
jsonReader: {
repeatitems: false
}
});
});
Solução
Não, você não pode fazer isso através jsonReader. Internamente, a grade faz:
ts.p.page = data[ts.p.jsonReader.page];
... que não vai funcionar para uma sub-propriedade pontilhada.
Em vez disso você vai precisar para buscar os dados de grade manualmente, definindo o tipo de dados para uma função. Você pode então buscar os dados com $ .ajax, e chamar grid.addJsonData quando se trata de volta, assim como a grade faz, exceto que em vez de passar toda a resposta que você vai passar uma sub-propriedade da resposta.
Outras dicas
Este post e links foram realmente útil. Eu não tenho uma compreensão clara sobre como isso funciona ainda, mas eu pensei que eu só iria postar isso para ajudar alguém a aliviar sua dor:)
Este é o JSON retorno de getRecords:
{ "id": - 1, "resultado": { "page": "1", "total": "1", "registros": "2", "linhas": [{ "id": "13", "invdate": "2007-10-06", "nome": "cliente 3" , "quantidade": "1000,00", "imposto": "0.00", "total": "1000,00", "nota": ""}, { "id": "12", "invdate": "2007 -10-06" , "nome": "cliente 2" , "quantidade": "700.00", "imposto": "140.00", "total": "840.00", "nota": "não imposto "}]}}
E este é o código de trabalho:
jQuery(document).ready(function(){
jQuery("#list4").jqGrid({
contentType: "text/plain; charset=utf-8",
datatype: function(postdata)
{
$.ajax({
url: 'http://localhost/Booga/Baba.ashx/getRecords',
data: "{}", // For empty input data use "{}",
dataType: "json",
type: "GET",
contentType: "application/json; charset=utf-8",
complete: function(response, status)
{
if(status=='success')
{
var mygrid = jQuery("#list4")[0];
var o = eval("(" + response.responseText + ")");// TODO don't use eval. it's insecure, but older browsers support it...
mygrid.addJSONData(o.result);
}
}
})
},
colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
colModel:[
{name:'id',index:'id', width:55},
{name:'invdate',index:'invdate', width:90, jsonmap:"invdate"},
{name:'name',index:'name asc, invdate', width:100},
{name:'amount',index:'amount', width:80, align:"right"},
{name:'tax',index:'tax', width:80, align:"right"},
{name:'total',index:'total', width:80,align:"right"},
{name:'note',index:'note', width:150, sortable:false}
],
jsonReader: {
repeatitems: false
}
});
});
A propósito, alguém sabe por que usar eval é inseguro? Olhe para o comentário no meu código. Peguei essa parte a partir do link forum.asp.
i. acrescenta um "{id: '- 1', 'resultado': {/ * ... snip ... * /}}". invólucro em torno do trabalho JSON
Este é um efeito colateral do caminho alças JayRock SMD respostas ... o "id" é um "identificador de resposta" e é uma ajuda para a comunicação assíncrona.
Então, se você disparar um monte de solicitações assíncronas (e não esperar pela resposta), você pode especificar o "pedido de ID" e JayRock honrará isso ... assim que você pode alinhar as respostas com os pedidos.
Espero que faz um pouco de sentido.