Answer / sonylal

To use my javascript you need to:

1. include the javascript using <script src="pager.js">
in your page header;
2. include a small css to skin the page navigation-bar
(i.e. for emphasizing the selected page using bold and
underline style);
3. define an ID on the table you want to scroll. i.e.
<table id="results"> ;
4. place an empty <div/> in the place you want to display
the navigation bar. i.e. <div id="pageNavPosition"> ;
5. include an initialization script at the bottom of your
page like this:

<script type="text/javascript"><!--
var pager = new Pager('results', 3);
pager.init();
pager.showPageNav('pager', 'pageNavPosition');
pager.showPage(1);
//--></script>

Where 'results' is the id of the table (see step #3), 3 is
the number of records per page, 'pager' is the name of the
variable (in red... that's ugly I agree...), and
pageNavPosition is the ID of the DIV inside of which the
pagination bar will be placed. The showPage(1) indicates
that, when loading the page, the 1st one should be displayed.


Regards
www.jobpuja.com

Answer / jayanthi

<script type="text/javascript"><!--
var pager = new Pager('results', 3);
pager.init();
pager.showPageNav('pager', 'pageNavPosition');
pager.showPage(1);
//--></script>

Answer / devendra kumar

<script type="text/javascript"><!--
var pager = new Pager('results',30);
pager.init();
pager.showPageNav('pager', 'pageNavPosition');
pager.showPage(1);
//-->
function Pager(tableName, itemsPerPage) {
this.tableName = tableName;
this.itemsPerPage = itemsPerPage;
this.currentPage = 1;
this.pages = 0;
this.inited = false;

this.showRecords = function(from, to) {
var rows = document.getElementById(tableName).rows;
// i starts from 1 to skip table header row
for (var i = 1; i < rows.length; i++) {
if (i < from || i > to)
rows[i].style.display = 'none';
else
rows[i].style.display = '';
}
}

this.showPage = function(pageNumber) {
if (! this.inited) {
alert("not inited");
return;
}

var oldPageAnchor =
document.getElementById('pg'+this.currentPage);
oldPageAnchor.className = 'pg-normal';

this.currentPage = pageNumber;
var newPageAnchor =
document.getElementById('pg'+this.currentPage);
newPageAnchor.className = 'pg-selected';

var from = (pageNumber - 1) * itemsPerPage + 1;
var to = from + itemsPerPage - 1;
this.showRecords(from, to);
}

this.prev = function() {
if (this.currentPage > 1)
this.showPage(this.currentPage - 1);
}

this.next = function() {
if (this.currentPage < this.pages) {
this.showPage(this.currentPage + 1);
}
}

this.init = function() {
var rows = document.getElementById(tableName).rows;
var records = (rows.length - 1);
this.pages = Math.ceil(records / itemsPerPage);
this.inited = true;
}

this.showPageNav = function(pagerName, positionId) {
if (! this.inited) {
alert("not inited");
return;
}

var element = document.getElementById(positionId);

var pagerHtml = '<span onclick="' + pagerName +
'.prev();" class="pg-normal"> &#171 Prev </span> | ';
for (var page = 1; page <= this.pages; page++)
pagerHtml += '<span id="pg' + page + '"
class="pg-normal" onclick="' + pagerName + '.showPage(' +
page + ');">' + page + '</span> | ';
pagerHtml += '<span onclick="'+pagerName+'.next();"
class="pg-normal"> Next &#187;</span>';

element.innerHTML = pagerHtml;
}
}
</script>
<style type="text/css">
.pg-normal {
color: black;
font-weight: normal;
text-decoration: none;
cursor: pointer;
}
.pg-selected {
color: black;
font-weight: bold;
text-decoration: underline;
cursor: pointer;
}
.style4 {font-weight: bold}
</style>

<table>
<tr>
<td width="500" align="left"
valign="top" height="20"><div id="pageNavPosition"></div></td>

</tr></table>
<table id="results">Data....</table>

What are javascript closures?when would you use them?

0 Answers  

---

What are the different types of errors available in javascript?

0 Answers  

---

a code in vb script, which creates a table of 5*2 in html this is a static table, one more same dynamic table, as we give input the table should get created.

0 Answers   IBM,

---

How are tag positions used in javascript?

0 Answers  

---

What is event bubbling in the dom?

0 Answers  

---

What does ecma stand for?

0 Answers  

---

Should I learn java first or javascript?

0 Answers  

---

How to define a named function in JavScript?

0 Answers  

---

How about 3+5+"8"?

0 Answers  

---

how can we use java script message alert with asp.net with useing vb.net coding show full process with its coading

1 Answers   NIC,

---

What is an asynchronous programming? Why is it important in javascript?

0 Answers  

---

Explain how to detect the operating system on the client machine?

0 Answers  

---