aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes dynamically add rows to the exitsting table Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Java 8 in Action this week in the Java 8 forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "dynamically add rows to the exitsting table" Watch "dynamically add rows to the exitsting table" New topic
Author

dynamically add rows to the exitsting table

satheesh subramani
Greenhorn

Joined: Jan 03, 2011
Posts: 29

i have the table with 100 records
at the first time the page loading i want to display only 10 records and the more link
if the link is clicked display 10 more records

the records are populated from the oracle database

i don't know how to use the oracle contents in javascript or ajax
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Ajax call makes call to the backend, backend grabs the next set of rows. The rows are returned. The callback function adds the rows to the table.

Eric
Charles Philip
Greenhorn

Joined: Feb 26, 2011
Posts: 5
If I understand well, you want to display 10 more records each time you click i.e. if you had 20 records and click, 10 records should append to the existing.


So this you can do it through innerHtml (on client side) i.e. you take the codes which are between your <table> tag and add the code replied by the server(responseText).

What I mean is this: Populate a string of the records which you want to add on server side. This string should contain your <tr><td><input type=text id="newCount" value="hereYouMakeTheServerWriteTheDataYouQueried">...

(Also include name and id attribute if you have to use it on client side)
Loop 10 times and make your string variable append each new record.
After looping, you should get a string which contains all your tags for the rows, the textboxes,value in the textboxes etc.

Then you make the server send this string. When the client receives this string(responseText), you use JS to append the server's reply with the existing code.

Make sure that your table is within a div.

If you don't understand AJAX, this won't be easy to explain you all the steps.



............

There's another alternative to AJAX which is not so nice(because it will require refreshing your page):

Store in a session the number of records.

Make your client request 10 new records:

1) Use the div tag to hide your text box, form. Set your text box value to 10 by default.
2) When you click, a request is sent and the server reads the value in the session.
3)You add this value to 10.Then you return to your page(refresh), read the new session value and Loop this number of times to populate your table.

AJAX is worth learning...
Nikhil Wanpal
Greenhorn

Joined: Apr 16, 2010
Posts: 11

satheesh subramani wrote:i don't know how to use the oracle contents in javascript or ajax

I think your question is more about how to make an oracle/sql query from javascript. I doubt that one can actually do that, As far as I know you will need to do something on the server side to call that.. like, JAVA to fetch the records from the database.

Once you get them, you can pass them as is to the client side and wrap into a table-row code and add to the existing table, or as suggested by Charles can also pass the formed string from the server and append to the table.
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: dynamically add rows to the exitsting table
 
Similar Threads
jsp reports
display first few records
Search Form
records per page
how to display Result set pagewise