enjaydo

Forum Replies Created

Viewing 1 replies (of 1 total)
  • Forum: Fixing WordPress
    In reply to: Using JQGrid in Posts
    Thread Starter enjaydo

    (@enjaydo)

    13 years, 6 months ago

    After learning about the structure of WP, I ended up putting the necessary scripts and css in my themes/scripts (or themes/js, depending on the theme) and themes/css folders respectively. All the themes I worked with already had jQuery, so I just needed to add the JQGrid scripts. Then I added references for the JQGrid css and scripts in the theme header: 

    <link rel="stylesheet" type="text/css" media="screen" href="<?php echo get_template_directory_uri(); ?>/css/ui-smoothness/jquery-ui-1.8.23.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="<?php echo get_template_directory_uri(); ?>/css/ui.jqgrid.css" />

<?php
  wp_enqueue_script("jquery");
  wp_enqueue_script("jqgridm", get_template_directory_uri() . "/scripts/i18n/grid.locale-en.js", array( "jquery" ));
  wp_enqueue_script("jqgrids", get_template_directory_uri() . "/scripts/jquery.jqGrid.src.js", array( "jquery" ));

  wp_head();
?>

    Afterwards, I could just put this right in the post:

    <script type="text/javascript">
jQuery(function() {
  jQuery("#tableid").jqGrid({
    url:'/json/json.php',
    datatype: "json",
    colNames:['a', 'b', 'c', 'd', 'e'],
    colModel:[
      {name:'a',index:'a', width:50},
      {name:'b',index:'b', width:225},
      {name:'c',index:'c', width:60},
      {name:'d',index:'d', width:75},
      {name:'e',index:'e', width:75, align:"right" }
    ],
    pager: '#pager',
    rowNum:100,
    sortname: 'e',
    sortorder: "asc",
    viewrecords: true,
    gridview: true,
    height: '100%',
    width: '100%',
    caption:"Title",
    loadComplete: function(reload) {
      jQuery("#myGridID").trigger("reloadGrid");
    }
  });
});
</script>

<body>
<table id="tableid"></table> <div id="pager"></div>
</body>

    I am using php to generate the data as json for the grid, and putting those in a json folder in my root www dir. My approach sounds a bit different than yours, but figured I would share my working solution.

    The only problem I have now is getting the grids to scale with the rest of the page, which I’m sure I’ll figure out when I get back around to it.

    If you want to share more details about what you are doing, I can see if I can offer any suggestions. I’ve been debating building a plugin for parametrized jqgrids, but that’s months out at this point if I decide to do it. Thanks!

Viewing 1 replies (of 1 total)