jQuery Grid Plugin - jqGridForum

Topic RSS

Cell Font Size

12/10/2009
17:26

Mike

Guest

Guests

I am trying to get a simple example of the grid working with Grails. I can't seem to adjust the font size of the cells no mater what I do.

I am new to Javascript and jqGrid. Are there any simple, standalone samples I could review?

Here is the HTML:

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <link rel="stylesheet" href="/netlib/css/cupertino/jquery-ui-1.7.2.custom.css"/>
  <link rel="stylesheet" href="/netlib/css/ui.jqgrid.css"/>
  <style>
  html, body {
    margin: 0;
    padding: 0;
  }
  </style>

  <title>OVE Universal Sellers</title>
  <script src="/netlib/js/jquery-1.3.2.min.js" type="text/javascript"></script>

  <script src="/netlib/js/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>
  <script src="/netlib/js/i18n/grid.locale-en.js" type="text/javascript"></script>
  <script src="/netlib/js/jquery.jqGrid.min.js" type="text/javascript"></script>

  <script type="text/javascript">
    jQuery(document).ready(function(){
    jQuery("#list").jqGrid({
    url:'/netlib/oveAsi/oveSlrList',
    datatype: 'xml',
    mtype: 'GET',
    colNames:['Seller Name','Univ ID', 'Group Number','City','State'],
    colModel :[
    {name:'sellerName', index:'sellerName', width:180},
    {name:'universalId', index:'universalId', width:60},
    {name:'groupNumber', index:'groupNumber', width:90},
    {name:'sellerCity', index:'sellerCity', width:90},
    {name:'sellerState', index:'sellerState', width:60}
    ],
    pager: '#pager',
    rowNum: 30,
    rowList:[10,20,30],
    sortname: 'sellerName',
    viewrecords: true,
    height: 'auto',
    autowidth: true,
    caption: 'OVE Sellers'
    });
    });
  </script>

</head>
<body>
<div class="nav">

  <span class="menuButton"><a class="home" href="/netlib">Home</a></span>
  <span class="menuButton"><a href="/netlib/oveAsi/create" class="create">New OVE Seller</a></span>
</div>
<div class="body" style="width: 800px; ">
  <h1>OVE Universal Sellers</h1>
  
  <div class="ui-jqgrid">
  <table id="list"></table>
  <div id="pager"></div>

    </div>
</div>
</body>

</html>

</pre>

14/10/2009
12:00

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Hello,

You will need to look at ui.jqgrid.css (The /* body */ section and espacially jqgrow tag) if you want to do it statically.

The entry font size is determined in the first line of css

/*Grid*/
.ui-jqgrid {position: relative; font-size:11px;}

...

If you want to do it for particular cell use setCell method.

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.

All RSS

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
43 Guest(s)

Currently Browsing this Page:
1 Guest(s)