jQuery Grid Plugin - jqGrid - Topic: Theme Problem

jarrod on Theme Problem

Tue, 04 Aug 2009 11:21:34 +0300

Hi,

I seem to have the same problem. I have tried everything you suggested but still do not get the correct style or images loading. I am using the trunk version of MonoRail.

Is there any information I could provide you with that would help us solve this problem?

Regards,

Jarrod

lance123 on Theme Problem

Tue, 28 Jul 2009 08:43:15 +0300

Hi tnesham,

That is fantastic! I have been banging my head against this for a few days now and that sorted it beautifully 😉

Thanks once again I am looking forward to using this,

Lance

tnesham on Theme Problem

Tue, 28 Jul 2009 06:38:24 +0300

lance123 said:

Hi Tony,

Thanks very much for the reply. I added this mod, but I am still getting no caption header graphic or nice style to the grid.

I have tried all sorts of changes to the dependencies. Any further tips would be really appreciated. ps changing the imgpath:

seems to do nothing, the pager div is unaffected?

Regards,

Lance

I just started looking at this grid this weekend and I had a similar problem. What I finally noticed is how version 3.5 is different in this area from previous versions. This version is using the Jquery UI.

It seems you are mixing older CSS. If you look at this: http://www.trirand.com/blog/?p.....-cell-edit

You can see the correct CSS and JS links. Get rid of yours and paste those in your page. After that works (and it did for me), then find the files and copy to your web server and fix you link references.

(Note: when copy pasting, make sure your double-quotes are correct ascii double-quotes; do search and replace.

So “ becomes ")

(also, watch out for cutting off </script> )

The last "gotcha" is the images location. If your CSS is at webroot/css then your images need to be at webroot/css/images. The images can be found in the same location as the other files, or http://www.trirand.com/jqgrid3.....s/redmond/

The thing about this to keep in mind is that the image files and jquery-ui-1.7.1.custom.css make up a unique theme. You cannot use a different jquery-ui-1.7.1.custom.css with different images because jquery-ui-1.7.1.custom.css refers to *those* images, while a different jquery-ui-1.7.1.custom.css can refer to different images depending on the theme.

tony on Theme Problem

Mon, 27 Jul 2009 03:19:07 +0300

Hello,

It seems that some css are not loaded. Please use FireBug and ensure that all the css files are loaded

Regards

Tony

lance123 on Theme Problem

Thu, 23 Jul 2009 07:55:31 +0300

Hi Tony,

Thanks very much for the reply. I added this mod, but I am still getting no caption header graphic or nice style to the grid.

I have tried all sorts of changes to the dependencies. Any further tips would be really appreciated. ps changing the imgpath:

seems to do nothing, the pager div is unaffected?

Regards,

Lance

tony on Theme Problem

Wed, 22 Jul 2009 01:19:42 +0300

Hello,

Try with this:

.....

<style>
html, body {
    margin: 0;
    padding: 0;
    font-size: 75%;
}

</style>

....

lance123 on Theme Problem

Mon, 20 Jul 2009 22:09:36 +0300

Hi To All,

I am trying to get the version 3.5 beta version up and going. I am having trouble with the theme looking wrong. (text is wrong size, not table header and the cells don't look like the theme they just have a line around them.) Is it the way I am trying to reference the dependencies? Have I missed a dependency? I tried to follow the install.txt on github. Thanks for any help, Lance

<html>

<head>

<title>jqGrid Demo</title>

jQuery(document).ready(function(){

jQuery("#list").jqGrid({

url:'testJqgrid.php',

datatype: 'xml',

mtype: 'GET',

colNames:['Inv No','Date', 'Amount','Tax','Total','Notes'],

colModel :[

{name:'invid', index:'invid', width:55},

{name:'invdate', index:'invdate', width:90},

{name:'amount', index:'amount', width:80, align:'left'},

{name:'tax', index:'tax', width:80, align:'left'},

{name:'total', index:'total', width:80, align:'left'},

{name:'note', index:'note', width:150, sortable:true} ],

pager: jQuery('#pager'),

rowNum:10,

rowList:[10,20,30],

sortname: 'id',

sortorder: "desc",

viewrecords: true,

imgpath: 'jqgrid/css/themes/coffee/images',

caption: 'My first grid'

});

</script>

</head>

<body>

</body>

</html>