1
Help for ParamQuery Grid (free version) / bug with json and ajax loading
« on: May 10, 2014, 03:58:44 am »
This is the code that generated query:
This is the js code:
This is the html code:
the error is:
Uncaught TypeError: undefined is not a function pqgrid.min.js:9
event.returnValue is deprecated. Please use the standard event.preventDefault() instead.
Code: [Select]
<?php
include("../../include/funciones.php");
/* variables */
$json = '[';
$campos = array("Continent,Population");
$tabla = "country";
$condicion = "1 group by Continent";
$ordenamiento = array("1");
$cont = 0;
$cadenaFecha = '';
/* consulta */
$listado = consultar($campos, $tabla, $condicion, $ordenamiento);
class country {
public $continent = '';
public $population = '';
public $color = '';
}
function random_color_part() {
return str_pad(dechex(mt_rand(0, 255)), 2, '0', STR_PAD_LEFT);
}
function random_color() {
return random_color_part() . random_color_part() . random_color_part();
}
$totalFilas = mysql_num_rows($listado);
if (mysql_num_rows($listado) != 0) {
while ($reg = mysql_fetch_assoc($listado)) {
$color = '#'.random_color();
$objetoCountry = new country();
$objetoCountry->continent = $reg["Continent"];
$objetoCountry->population = $reg["Population"];
$objetoCountry->color = $color;
if ($cont == $totalFilas - 1)
$json = $json . json_encode($objetoCountry);
else
$json = $json . json_encode($objetoCountry) . ",";
$cont++;
}
$json = $json . ']';
echo $json;
} else
echo 'false';
?>
This is the js code:
Code: [Select]
$(document).ready(function() {
peticion_ajax();
});
function peticion_ajax()//se carga el select el personal del centro
{
var xhr = $.ajax({
url: "generar_consulta.php",
dataType: "text",
cache: false,
statusCode: {
404: function() {
alert("La página no existe (personal cabecera)");
}
},
context: document.body
}).done(function(data) {//callBack
var obj = {width: 700, height: 400, title: "Grid From JSON data", flexHeight: true};
obj.colModel = [{title: "Rank", width: 100, dataType: "integer", dataIndx: "rank"},
{title: "Company", width: 200, dataType: "string", dataIndx: "company"},
{title: "Revenues ($ millions)", width: 150, dataType: "float", align: "right", dataIndx: "revenues"},
{title: "Profits ($ millions)", width: 150, dataType: "float", align: "right", dataIndx: "profits",
render: function(ui) {
var rowData = ui.rowData,
dataIndx = ui.dataIndx,
cellData = rowData[dataIndx],
profits = cellData.replace(",", ""),
revenues = rowData["revenues"].replace(",", "");
if (profits / revenues > 0.1) {
return "<span style='color:green;'>" + cellData + "</span>";
}
else {
return "<span style='color:red;'>" + cellData + "</span>";
}
}
}];
obj.dataModel = {
data: data,
location: "local",
sorting: "local",
paging: "local",
curPage: 1,
rPP: 10,
sortIndx: "revenues",
sortDir: "up",
rPPOptions: [1, 10, 20, 30, 40, 50, 100, 500, 1000]
};
$("#grid_array").pqGrid(obj);
xhr.abort();
});
}
This is the html code:
Code: [Select]
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!-- Jquery General -->
<script type="text/javascript" src="../../include/jquery-ui-1.10.3.custom/js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="../../include/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.js"></script>
<!--PQ Grid files-->
<link rel="stylesheet" href="grid/pqgrid.min.css" />
<script src="grid/pqgrid.min.js"></script>
<!--PQ Grid Office theme-->
<link rel="stylesheet" href="grid/themes/office/pqgrid.css" />
<!-- Jquery General -->
<script type="text/javascript" src="funciones.js"></script>
</head>
<body>
<div id="grid_array" style="margin:100px;">
</div>
<span id="results">
</span>
</body>
</html>
the error is:
Uncaught TypeError: undefined is not a function pqgrid.min.js:9
event.returnValue is deprecated. Please use the standard event.preventDefault() instead.