I just started trying to work with paramquery using an xml file. I basically copy and pasted from the xml demo renaming the fields to what I wanted to use. The output display is attached, using the xml file below the code. My entire aspx file is below. No matter what demo I use, I get similar odd ball results. I've tried the free version and the eval pro version with the same results. I am using IE 10. What am I doing wrong?
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UserMaintenance.aspx.cs" Inherits="UserMaintenance" %>
<!DOCTYPE html>
<html xmlns="
http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<!--jQuery dependencies-->
<link rel="stylesheet"
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" />
<script src="
http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<!--Include Touch Punch file to provide support for touch devices-->
<script type="text/javascript" src="/js/grid-2.0.4/touch-punch/touch-punch.min.js" ></script>
<!--ParamQuery Grid files-->
<link rel="stylesheet" href="/js/grid-2.0.4/pqgrid.min.css" />
<script type="text/javascript" src="/js/grid-2.0.4/pqgrid.min.js" ></script>
<script type="text/javascript">
$(function () {
var colModel = [
{ title: "User Name", dataType: "string", width: "120", dataIndx: 0 },
{ title: "Email", dataType: "string", width: "150", dataIndx: 1 },
{ title: "Role", dataType: "string", width: "120", dataIndx: 2 },
{ title: "Created", dataType: "string", width: "120", dataIndx: 3 },
{ title: "Last Accessed", dataType: "string", width: "120", dataIndx: 4 },
{ title: "Login Count", dataType: "string", width: "120", dataIndx: 5 },
{ title: "Comment", dataType: "string", width: "120", dataIndx: 6 }
];
var dataModel = {
cache: true,
location: "remote",
sortDir: "down",
sorting: "local",
dataType: "xml",
url: "/UserStats.xml",
getData: function (dataDoc) {
//debugger;
//$(dataDoc).find("price").each(function(i,pNode){
// var txt=$(pNode).text();
// txt=txt.replace("$","");
// $(pNode).text(txt);
//});
var obj = { itemParent: "Account", itemNames: ["Username", "Email", "Role", "CreationDate", "LastAccessed", "LoginCount", "Comment"] };
return { data: $.paramquery.xmlToArray(dataDoc, obj) };
}
};
var obj={ width: 890, height: 400,
dataModel: dataModel,
colModel: colModel,
pageModel: { rPP: 4, type: "local", rPPOptions: [1, 2, 5, 10, 20, 100]},
title: "<b>Current Users</b>",
flexHeight: true,
paging: true,
draggable: true,
//resizable:true,
scrollModel: {autoFit:true},
freezeCols: 0
};
var $grid=$("div#xml_grid").pqGrid(obj);
});
</script>
<div id="xml_grid" style="margin:auto;"></div>
</div>
</form>
</body>
</html>
***** xml file *****<?xml version="1.0" encoding="utf-8">
<Accounts>
<Account>
<Username>aa</Username>
<Email>
[email protected]</Email>
<Role>Student</Role>
<CreationDate>6/20/2016</CreationDate>
<LastAccessed>6/30/2016</LastAccessed>
<LoginCount>1</LoginCount>
<Comment />
</Account>
<Account>
<Username>steve</Username>
<Email>
[email protected]</Email>
<Role>Student</Role>
<CreationDate>6/29/2016 6:03 PM</CreationDate>
<LastAccessed>6/29/2016 6:03 PM</LastAccessed>
<LoginCount>1</LoginCount>
<Comment />
</Account>
<Account>
<Username>test</Username>
<Email>
[email protected]</Email>
<Role>Student</Role>
<CreationDate>6/30/2016 5:08 PM</CreationDate>
<LastAccessed>6/30/2016 5:08 PM</LastAccessed>
<LoginCount>1</LoginCount>
<Comment />
</Account>
<Account>
<Username>test1</Username>
<Email>
[email protected]</Email>
<Role>Student</Role>
<CreationDate>6/30/2016 4:47 PM</CreationDate>
<LastAccessed>6/30/2016 4:47 PM</LastAccessed>
<LoginCount>1</LoginCount>
<Comment />
</Account>
</Accounts>
