469,587 Members | 2,666 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,587 developers. It's quick & easy.

pagination problem

149 100+
hi,
i need to implement pagination in my project..i m using struts2..in my jsp page im implementing pagination using javascript...it is showing error as 'rows is undefined'...i tried the same with sample its working fine..if i implement in my application it is showing error..
Expand|Select|Wrap|Line Numbers
  1. <style type="text/css">
  2.     .pg-normal {
  3.         color: #0000FF;
  4.         font-weight: normal;
  5.         text-decoration: none;
  6.         cursor: pointer;
  7.     }
  8.     .pg-selected {
  9.         color: #800080;
  10.         font-weight: bold;
  11.         text-decoration: underline;
  12.         cursor: pointer;
  13.     }
  14. </style>
  15. <script type="text/javascript">
  16.     function Pager(tableName, itemsPerPage) {
  17.         this.tableName = tableName;
  18.         this.itemsPerPage = itemsPerPage;
  19.         this.currentPage = 1;
  20.         this.pages = 0;
  21.         this.inited = false;
  22.         this.showRecords = function(from, to) {
  23.             var rows = document.getElementById(tableName).rows;
  24.             // i starts from 1 to skip table header row
  25.             for (var i = 1; i < rows.length; i++) {
  26.                 if (i < from || i > to)
  27.                     rows[i].style.display = 'none';
  28.                 else
  29.                     rows[i].style.display = '';
  30.             }
  31.        }
  32.         this.showPage = function(pageNumber) {
  33.             if (! this.inited) {
  34.                 alert("not inited");
  35.                 return;
  36.             }
  37.             var oldPageAnchor = document.getElementById('pg'+this.currentPage);
  38.             oldPageAnchor.className = 'pg-normal';
  39.             this.currentPage = pageNumber;
  40.             var newPageAnchor = document.getElementById('pg'+this.currentPage);
  41.             newPageAnchor.className = 'pg-selected';
  42.             var from = (pageNumber - 1) * itemsPerPage + 1;
  43.             var to = from + itemsPerPage - 1;
  44.             this.showRecords(from, to);
  45.         }
  46.         this.prev = function() {
  47.             if (this.currentPage > 1)
  48.                 this.showPage(this.currentPage - 1);
  49.         }
  50.         this.next = function() {
  51.             if (this.currentPage < this.pages) {
  52.                 this.showPage(this.currentPage + 1);
  53.             }
  54.         }
  55.         this.init = function() {
  56.             var rows = document.getElementById(tableName).rows;
  57.             var records = (rows.length - 1);
  58.             this.pages = Math.ceil(records / itemsPerPage);
  59.             this.inited = true;
  60.         }
  61.         this.showPageNav = function(pagerName, positionId) {
  62.             if (! this.inited) {
  63.                 alert("not inited");
  64.                 return;
  65.             }
  66.             var element = document.getElementById(positionId);
  67.             var pagerHtml = '<span onclick="' + pagerName + '.prev();" class="pg-normal"> &#171 Prev </span> | ';
  68.             for (var page = 1; page <= this.pages; page++)
  69.                 pagerHtml += '<span id="pg' + page + '" class="pg-normal" onclick="' + pagerName + '.showPage(' + page + ');">' + page + '</span> | ';
  70.             pagerHtml += '<span onclick="'+pagerName+'.next();" class="pg-normal"> Next »</span>';
  71.             element.innerHTML = pagerHtml;
  72.         }
  73.     }
  74. </script><table  id="manage"  border="1" width="100%" class="headertable" cellpadding="0" cellspacing="0">
  75.         <thead>
  76.             <tr>
  77.                 <th align="left">
  78.                     ContentID
  79.                 </th>
  80.                 <th align="left">
  81.                     Title
  82.                 </th>
  83.                 <th align="left">
  84.                     Description
  85.                 </th>
  86.                 <th align="left">
  87.                     Charge
  88.                 </th>
  89.                 <th align="left">
  90.                     Rating
  91.                 </th>..and the code goes on at the end of form
  92. </table>
  93.     <div id="pageNavPosition"></div>
  94.  
  95. </s:form>
  96. <script type="text/javascript"><!--
  97.     var pager = new Pager('manage', 3);
  98.     pager.init();
  99.     pager.showPageNav('pager', 'pageNavPosition');
  100.     pager.showPage(1);
  101.     //--></script>   
  102.  
Oct 28 '10 #1
1 1612
madhuriks
149 100+
any help regarding my post
Oct 28 '10 #2

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

2 posts views Thread by Chris H | last post: by
11 posts views Thread by ste | last post: by
reply views Thread by George Ter-Saakov | last post: by
2 posts views Thread by =?Utf-8?B?SnVsaWEgQg==?= | last post: by
16 posts views Thread by gnawz | last post: by
2 posts views Thread by kkshansid | last post: by
2 posts views Thread by lisles | last post: by
reply views Thread by suresh191 | last post: by
4 posts views Thread by guiromero | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.