Forum

November 2nd, 2014
A A A
Avatar
sp_LogInOut Log In

Lost password?
sp_Search Search
Advanced Search
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

sp_Search Search
Go to Bottom
The forums are currently locked and only available for read only access
This topic is locked No permission to create posts
sp_Feed Topic RSS sp_TopicIcon
jgrid not displaying data
28/12/2009
17:02
Avatar
xworker
Member
Members
Forum Posts: 9
Member Since:
28/12/2009
sp_UserOfflineSmall Offline
Go to Top
1sp_Permalink sp_Print

Hi

Can't get jgrid to display my data. I see alot of javascirpt warnings in the error console.

My code on the page:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>My First Grid</title>

        <link rel="stylesheet" type="text/css" media="screen" href="themes/redmond/jquery-ui-1.7.1.custom.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="themes/ui.jqgrid.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="themes/ui.multiselect.css" />
        <style>
            html, body {
                margin: 0;
                padding: 0;
                font-size: 75%;
            }
        </style>

        <script src="js/jquery.js" type="text/javascript"></script>
        <script src="js/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>
        <script src="js/jquery.layout.js" type="text/javascript"></script>
        <script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
        <script type="text/javascript">
            $.jgrid.no_legacy_api = true;
            $.jgrid.useJSON = true;
        </script>
        <script type="text/javascript">
   jQuery.extend(jQuery.jgrid,{
      parse:function(jsstring) {
         return JSON.parse(jsstring);
      }
   });
</script>

        <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
        <script src="js/jquery.tablednd.js" type="text/javascript"></script>
        <script src="js/jquery.contextmenu.js" type="text/javascript"></script>
        <script src="js/ui.multiselect.js" type="text/javascript"></script>
        <script type="text/javascript">

            jQuery(document).ready(function(){

                jQuery("#list").jqGrid({
                    url:'stats?player=xxx',
                    datatype: 'json',
                    mtype: 'GET',
                    colNames:['matchID','hero', 'score', 'xp','creeps','result','psr','kd'],
                    colModel:[
                        {name:'matchID',index:'matchID', width:90},
                        {name:'hero',index:'hero', width:100},
                        {name:'score',index:'score',width:80, align:"right"},
                        {name:'xp',index:'xp', width:80, align:"right"},
                        {name:'creeps',index:'creeps', width:80,align:"right"},
                        {name:'result',index:'result', width:150, sortable:false},
                        {name:'psr',index:'psr', width:80,align:"right"},
                        {name:'kd',index:'kd', width:80,align:"right"}
                    ],

                    pager: '#pager',
                    rowNum:10,
                    rowList:[10,20,30],
                    sortname: 'matchID',
                    sortorder: 'desc',
                    viewrecords: true,
                    caption: 'stats'
                });
                jQuery("#list").jqGrid('navGrid','#pager',{edit:false,add:false,del:false});
            });
        </script>

    </head>
    <body>
        <table id="list"></table>
        <div id="pager"></div>

    </body>
</html>

The server is a servlet wich output json. Content type is set to "application/json" and the server outputs correctly.

Some of the warnings i see in the console:

Varning: anonymous function does not always return a value
Källkodsfil: http://localhost:8080/StatsServlet/js/jquery.js
Rad: 19, kolumn: 201
Källkod:
F){return this.each(function(){o.event.trigger(E,F,this)})},triggerHandler:function(E,G){if(this[0]){var F=o.Event(E);F.preventDefault();F.stopPropagation();o.event.trigger(F,G,this[0]);return F.result}},toggle:function(G){var E=arguments,F=1;while(F<E.le

Varning: reference to undefined property ts.p.serializeGridData
Källkodsfil: http://localhost:8080/StatsServlet/js/jquery.jqGrid.min.js
Rad: 10

Varning: function eval must be called directly, and not by way of a function of another name
Källkodsfil: http://localhost:8080/StatsServlet/js/jquery.js
Rad: 19

Varning: reference to undefined property o.cache[H][E]
Källkodsfil: http://localhost:8080/StatsServlet/js/jquery.js
Rad: 12

among others.

Any ideas?

Thanks

/x

28/12/2009
17:13
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline
sp_UserWebsite
Go to Top
2sp_Permalink sp_Print

Hello,

How look your json output. Maybe you will need to configure your jsonReader.

Look here

http://www.trirand.com/jqgridw.....#json_data

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

28/12/2009
17:44
Avatar
xworker
Member
Members
Forum Posts: 9
Member Since:
28/12/2009
sp_UserOfflineSmall Offline
Go to Top
3sp_Permalink sp_Print

ok. so I need to define my own reader. Where do I do that?

My output is like this:

[{"matchID":"123456","hero":"mrx","score":"0","xp":"0","creeps":"0","result":"0","psr":"-0","kd":"0"}]

So I dont really have a root. Can it be empty?

/x

28/12/2009
18:19
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline
sp_UserWebsite
Go to Top
4sp_EditHistory sp_Permalink sp_Print

Hello,

You should define the reader in grid options. Also you will need to provide additional information about the number of records and etc, as described into the docs.

If this is not possible for you you should define datatype as function and put some information into the response before pass it to the grid.

Best Regards

Tony

P.S.

You can not define your own JSON parse function if you set

$.jgrid.useJSON = true;

The grid uses it if the flag is set to true

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

29/12/2009
09:51
Avatar
xworker
Member
Members
Forum Posts: 9
Member Since:
28/12/2009
sp_UserOfflineSmall Offline
Go to Top
5sp_Permalink sp_Print

Ok, my reader is like this:

   jQuery("#list").jqGrid({

                jsonReader : {
                    root:"matches",
                    page: "currpage",
                    total: "totalpages",
                    records: "totalrecords",
                    id: "matchID"

                },

                url:'stats?player=xworker',
                datatype: "json",
                colNames:['matchID','hero', 'score', 'xp','creeps','result','psr','kd'],
                colModel:[
                    {name:'matchID',index:'matchID', width:90,key:true},
                    {name:'hero',index:'hero', width:100},
                    {name:'score',index:'score',width:80, align:"right"},
                    {name:'xp',index:'xp', width:80, align:"right"},
                    {name:'creeps',index:'creeps', width:80,align:"right"},
                    {name:'result',index:'result', width:150, sortable:false},
                    {name:'psr',index:'psr', width:80,align:"right"},
                    {name:'kd',index:'kd', width:80,align:"right"}
                ],
                rowNum:10,
                rowList:[10,20,30],
                pager: '#pager',
                sortname: 'id',
                viewrecords: true,
                sortorder: "desc",
                multiselect: false,
                caption: "Stats"

            });

and I changed the data so that it conatins information about number of entries etc. Like this:

{totalpages:4, currpage:1,totalrecords:40 matches:[{"matchID":"17372766","hero":"DiseasedRider","score":"7/0","xp":"9601","creeps":"54","result":"loss","psr":"-15","kd":"7"},...]}

But it still doesnt load. Any ideas?

Thx

/x

29/12/2009
10:05
Avatar
xworker
Member
Members
Forum Posts: 9
Member Since:
28/12/2009
sp_UserOfflineSmall Offline
Go to Top
6sp_Permalink sp_Print

Should I have this on my page or not ?

   <script type="text/javascript">
            $.jgrid.no_legacy_api = true;
            $.jgrid.useJSON = true;
        </script>
        <script type="text/javascript">
            jQuery.extend(jQuery.jgrid,{
                parse:function(jsstring) {
                    return JSON.parse(jsstring);
                }
            });
        </script>

I get this error in the console :

Fel: JSON.parse
29/12/2009
16:52
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline
sp_UserWebsite
Go to Top
7sp_Permalink sp_Print

Hello,

If you read my previous post you will see that this is not needed- i.e your code for JSON.parse

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

This topic is locked No permission to create posts
sp_Feed All RSS
Go to top
Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
47 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information