Ver Mensaje Individual
  #2 (permalink)  
Antiguo 02/08/2010, 15:35
jloronoz
 
Fecha de Ingreso: febrero-2010
Ubicación: Porlamar
Mensajes: 1
Antigüedad: 14 años, 9 meses
Puntos: 0
Respuesta: Problema con Flexigrid de jQuery

Cita:
Iniciado por prosi Ver Mensaje
Hola,

tengo el siguiente html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Flexigrid</title>
<link rel="stylesheet" type="text/css" href="css/flexigrid/flexigrid.css">
<script type="text/javascript" src="lib/jquery/jquery.js"></script>
<script type="text/javascript" src="flexigrid.js"></script>
<style>

body
{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}

.flexigrid div.fbutton .add
{
background: url(css/images/add.png) no-repeat center left;
}

.flexigrid div.fbutton .delete
{
background: url(css/images/close.png) no-repeat center left;
}


</style>
</head>

<body>

<b>This is a sample implementation attached to a form, to add additional parameters</b>

<form id="sform">
<p>
The values you entered will be place in name column for demo's sake.<br />
Value 1 : <input type="text" name="val1" value="" autocomplete="off" /><br />
Value 2 : Is a hidden input with value 3<input type="hidden" name="val2" value="3" /><br />
Value 3 :
<select name="val3">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
<option value="5">Five</option>
</select><br />
Value 4 : <input type="checkbox" name="val4" id="val4" value="4" /><label for="val4">This will pass a value 4 if checked</label>
</p>
<p>
<input type="reset" value="Reset" />
<input type="submit" value="Submit" />
</p>

</form>

<table id="flex1" style="display:none"></table>

<script type="text/javascript">

$("#flex1").flexigrid
(
{
url: "/Ejemplo_jQuery_Grid/States",
dataType: 'json',
colModel : [
{display: 'Name', name : 'name', width : 40, sortable : true, align: 'center'}/*,
{display: 'Label', name : 'label', width : 180, sortable : true, align: 'left'},
{display: 'Abbreviation', name : 'abbreviation', width : 120, sortable : true, align: 'left'},
{display: 'ISO3', name : 'iso3', width : 130, sortable : true, align: 'left', hide: true},
{display: 'Number Code', name : 'numcode', width : 80, sortable : true, align: 'right'}*/
],
searchitems : [
{display: 'ISO', name : 'name'}/*,
{display: 'Name', name : 'name', isdefault: true}*/
],
sortname: "name",
sortorder: "asc",
nowrap:false,
usepager: true,
title: 'Countries',
useRp: true,
rp: 15,
method:"get",
showTableToggleBtn: true,
width: 700,
onSubmit: addFormData,
height: 200
}
);




//This function adds paramaters to the post of flexigrid. You can add a verification as well by return to false if you don't want flexigrid to submit
function addFormData()
{

//passing a form object to serializeArray will get the valid data from all the objects, but, if the you pass a non-form object, you have to specify the input elements that the data will come from
var dt = $('#sform').serializeArray();
$("#flex1").flexOptions({params: dt});
return true;
}

$('#sform').submit
(
function ()
{
$('#flex1').flexOptions({newp: 1}).flexReload();
return false;
}
);


</script>

</body>
</html>

Y el servlet es:

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("entra");// TODO Auto-generated method stub
response.setContentType("text/json");
List objs = new ArrayList();
Objeto objeto = new Objeto();
objeto.setName("jose");
objs.add(objeto);
JSONArray ja = new JSONArray();
ja.put(objs);
response.getWriter().write("({\"listaObjetos\":" + ja.toString() + "})");
//response.addHeader("X-JSON", "{identifier:\"abbreviation\",items: [{name:\"Alabama\", label:\"Alabama\",abbreviation:\"AL\"},{name:\"Ala ska\", label:\"Alaska\",abbreviation:\"AK\"},{name:\"Barc elona\", label:\"Barcelona\",abbreviation:\"BCN\"}]}");
//response.getWriter().write("{identifier:\"abbrevia tion\",items: [{name:\"Alabama\", label:\"Alabama\",abbreviation:\"AL\"},{name:\"Ala ska\", label:\"Alaska\",abbreviation:\"AK\"},{name:\"Barc elona\", label:\"Barcelona\",abbreviation:\"BCN\"}]}");
//response.getWriter().println("{\"identifier\": \"abbreviation\",\"items\": [{\"name\": \"Alabama\",\"label\": \"Alabama\",\"abbreviation\": \"AL\"}]}");

}

El problema está en que no me muestra los datos en el grid y en la información de página me da el siguiente error:
--> Displaying NaN to NaN of undefined items

Alguien podría ayudarme, por favor?.

Saludos!!

Buenas tardes amigo ya solucionaste el problema, pues te puedo ayudar si posteas el codigo del post2.php que trae consigo el flexigrid


Jose Luis Oronoz Troconis
Director Ejecutivo Openidea
---

http://www.openidea.com.ve