javascript Help
Hi,
I have one Array in javascript. Suppose my Array contains 20 elements . I want to display 5 elements at a time & I have one 'Next' button to display all remaining elements pagewise.
For this I have written two functions. One is printArray() & other is nextElements()
I want to display all elemets in tabular form.
When i click next button first time it is working fine . but second time it is generating new page with 5 elements within <table> tag.Since it is new page it is not having nextElement().
I want to do this. Could you please help me ?
Thank you,
-priya
[648 byte] By [
Priyam] at [2007-9-26 1:34:09]
I need your help..is anybody there ?
Well, you'll need to print the nextElement()-function to the other page too, don't you? Or at least use a <script src="function.js">-style tag...BTW: what has this got to do with JSP?
the new page needs to know the state of which set of elements it is displaying.
use JSP to pass what number you want to display next:
printArray.jsp?index=6
var startIndex = <%= request.getParameter("index")%>;
function printArray(startIndex) {
// num is what number index it should start printing from
for i=0 i<(startIndex + 5) i++ {
document.writeln(i);
}
}
the NEXT button should always pass the startIndex + 5
get what i mean?
-wjp
Hi,
I have already written nextElements() in generated page.It works fine but again if I click next button it is not able to view nextElements().
It is in JSP. I'm getting that Array in JSP & I'm transferring it to javascript.
I don't know how to do this .
I appreciate your help.
Thanks
Hi , I don't want any java code in between javascript's 2 functions.I'm getting an array from jsp transferring it to javascript function & I want to populate it pagewise.Thanks.
How about putting that nextElement() function to a separate script file and using the <script src=...>-tag? In the nextElement-function you write that tag to the new document. This way the same functionality is available for all pages created through that funtion.
This can be used even if the page is created dynamically from JSP.
I would put the entire table within a <div> tag so that the contents of the table are scrollable. No need to go to the next page at all. Just specify the height and with in pixels.<div style="width:500px; height:175px; overflow: auto;">
Hi ,
I added DIV tag in my program. but still I'm getting error 'Object not found'
Could you please help me?
<html>
<head>
<script>
var sIndex = parseInt(0);
var eIndex = parseInt(2);
var pSize = parseInt(2);
var x = new Array("a","b","c","d","e");
display(sIndex,eIndex,x);
function display(msIndex,meIndex,y)
{
var z = new Array();
z = y;
document.writeln('<div style="width:500px; height:175px; overflow: auto;">');
document.writeln('<table>');
for(var i = msIndex; (i < meIndex) && (i < z.length); i++)
{
document.writeln('<tr>');
document.writeln('<td>');
document.writeln(z);
document.writeln('</td>');
document.writeln('</tr>');
msIndex = i;
}
document.writeln('</table>');
document.writeln('</div>');
document.writeln("<input type = button value = next onClick = 'nextRecords(" + msIndex + "," + meIndex + ")'>");
}
function nextRecords(nsIndex,neIndex)
{
if ((nsIndex > 0) && (nsIndex < x.length))
{
nsIndex = neIndex;
neIndex = nsIndex + pSize;
display(nsIndex,neIndex,x);
}
}
</script>
</head>
<body>
<form name = frm>
</form>
</body>
</html>
Iam just giving here a sample code for using scollable table data. There will be no need to use the next button as the scrollbars are better way to present than the next button. Just populate the data within the table. The <div> will take care of the scrolling. Hope this works!
<html>
<head>
<script>
function display(){
document.writeln('<h4>Scrollable Table Demo !!</h4>');
document.writeln('<div style="width:250px; height:175px; overflow: auto;">');
document.writeln('<table>');
for(var i = 0; i < 25 ; i++) {
document.writeln('<tr>');
document.writeln('<td>');
document.writeln("test"+i);
document.writeln('</td>');
document.writeln('</tr>');
}
document.writeln('</table>');
document.writeln('</div>');
}
</script>
</head>
<body onLoad="display();">
<form name = frm>
</form>
</body>
</html>
Hi Kalyan,Its working but I don't want scrollable table. I want next & previous buttons to display contents of an array pagewise.Could you tell me how to do it?Thank you.-Priya
Hope this works!
Save the file as temp.jsp
if you want to rename the file to something else , make sure u also change the hyper link also. You can put a image button instead of hyperlink or u can write a little javascript to the hyperlink stuff.
mail me at r_kalyan_raman@yahoo.com should you have any doubt.
<html>
<head>
<% String index = request.getParameter("index");
String fun = request.getParameter("function");
if (index == null || index.trim().length() < 1) {
index = "1";
}
%>
<script language="JavaScript">
</script>
</head>
<body>
<form name ="frm">
<table>
<%
int temp = Integer.parseInt(index);
if (temp < 1) {
temp = 1;
}
for(int i=temp; i<(temp+5); i++) {
%>
<tr>
<td><%=i %></td>
</tr>
<%
}
%>
<tr>
<td><a href=temp.jsp?index=<%=temp-5 %>&func=previous>previous.gif</a></td>
<td><a href=temp.jsp?index=<%=temp+5 %>&func=next>next.gif</a></td>
</tr>
</table>
</form>
</body>
</html>
Thank you Kalyan.It works great ! I also did it using JSP . The same functionality I wanna do in pure javascript. Its like display contents of javascript array pagewise using html next & previous buttons.
Use the array elements to populate the table. This should definitely work for you.
Kalyan
<%
String index = request.getParameter("index");
if (index == null) {
index = "";
}
%>
<head>
<script language="JavaScript"></script>
</head>
<form name ="frm">
<body onLoad="display();">
<table>
</table>
<input type="hidden" name="index" value=<%=index %>>
</body>
</form>
<script language="JavaScript">
function display(){
//alert(document.frm.index.value);
startIndex = document.frm.index.value;
if (startIndex < 1) {
startIndex = 1;
}
nextIndex = ((startIndex*1) + 5);
previousIndex = ((startIndex*1) - 5);
document.writeln('<table>');
for(var i = startIndex; i < ((startIndex*1)+5) ; i++) {
document.writeln('<tr>');
document.writeln('<td>');
document.writeln('test'+i);
document.writeln('</td>');
document.writeln('</tr>');
}
document.writeln('<a href=temp1.jsp?index='+previousIndex+'>previous.gif</a>');
document.writeln('<a href=temp1.jsp?index='+nextIndex+'>next.gif</a>');
document.writeln('</table>');
}
</script>
Its working great.I'll implement this logic in my scriptIf I've any problem once again I'll trouble u.Thank you very much.-Priya
No Problem, Keep learning!!
No problem, You are Welcome !Keep Learning.
