/    Sign up×
Community /Pin to ProfileBookmark

display dynamic table rows in the same page

Copy linkTweet thisAlerts:
Mar 10.2003

There are three drop down boxes: shopname, country and sell at the top of a page.(initial value of the above drop down boxes is set to “ALL”)
Below the drop down boxs, there is a table for displaying all records
i.e.
the following is the table?retrieved from database)
shopname country sell

***************************

shopABC HK stationery
shopABC US flowers
shopABC BK furniture
shop123 HK flowers
shop123 HK fruit
(i have successfully got all the records from database into this jsp, and have put all the result set to a two-dimensional array )

what i want to do is: when user click the drop-down box “shopname” with value “shopABC”, then the table will be filtered and displayed as
shopname country sell

***************************

shopABC HK stationery
shopABC US flowers
shopABC BK furniture

if user click the drop-down box “country” with value “HK”, then the table will be displayed as
shopname country sell

***************************

shopABC HK stationery
shop123 HK flowers
shop123 HK fruit

if user click the drop-down box with both “shopname” and “country” with value “shop123” and “HK”
then the table will be displayed as
shopname country sell

***************************

shop123 HK flowers
shop123 HK fruit

How can i do that??

to post a comment
JavaScript

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@khalidali63Mar 10.2003 — Here is how you can do this.

in the select box's onchange put a function say

process()

<select name="listbox" onchange="process">

and then in the Javascript tags

function process(){

var table = document.createElement("table")

and on the same line create tr and td's and give them values using document.createTextNode("value")

Hope this helps

Khalid

}
Copy linkTweet thisAlerts:
@glotsaauthorMar 10.2003 — thanks for your suggestion, but in fact , the following table is generated from database result set, i have put all the result set into a two dimensional arrayin class DetailsDAO(), so that i can get the array by calling class DetailsDAO()

how can i update the this table by the user selection?

<table id="record">

<tr>

<td>shop name</td>

<td>country</td>

<td>selling</td>

</tr>

<% DetailsDAO detailsdao=new DetailsDAO();

String[][] result=detailsdao.getRecord();

for (int i=0;i<NoOfRecord;i++){%>


<tr>

<td>result[i][1]</td>

<td>result[i][2]</td>

<td>result[i][3]</td>

</tr>

<%}%>

</table>
Copy linkTweet thisAlerts:
@khalidali63Mar 10.2003 — exactly as I suggested above,since you have id for table use documetn.getElementById() and update the info in the tr and tds/creae new values and append

You may have to read on how to work with dom methods.

http://cgi.din.or.jp/~hagi3/JavaScript/Mozilla/SampleList.cgi?fmt=html

Khalid
Copy linkTweet thisAlerts:
@glotsaauthorMar 11.2003 — how do i create table rows in the javascript function??

can u give me some simple examples??
×

Success!

Help @glotsa spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.3,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...