onClick create a frame in the lower half of the page

[dvknn]

Hi,

I am a backend' java developer and getting to do some 'front-end GUI coding'. I can some simple stuff, but I need help with this.

I have a page that has 'Add', 'Edit', 'Delete', 'Save', 'Cancel' and 'Exit' buttons on top of the page and a HTML table. The table has 7 columns and rows could be a lot (I am not sure of the number because it's dependant on the data contained in the database). I pull the data from server to display in the table.

In the same page, when I click 'Add', I want a 'frame' with these 7 fields (text boxes or combo boxes) to appear in the lower half of the table. I enter data and click 'Submit'. I want the data to be added to the table.

- Thanks

 

[mwolf00]

I'm guessing that since you can edit, that the data are already displayed in input boxes. Are you using separate FORM tags for each row? You can use the DOM to clone a whole row as well as all of the contents...

newRow = document.getElementById("oldRowID").cloneNode(true)
document.getElementById("oldRowID").parentNode.appendChild(newRow)

Or you can create each element w/in the row and append it...

newTR = document.createElement("tr")
newTD = document.createElement("td")
newInput = document.createElement("input")
newInput.id = "newID"
newTD.appendChild(newInput)
newRow.appendChild(newTD)
document.getElementById("oldRowID").parentNode.appendChild(newTR)

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

 

[dvknn]

Sorry, I did not metion. I cannot 'Edit either.
Also, when I click 'Add' I would like to create the 'textboxes' or 'combo boxes' in a 'separate frame'.

The code above is generating a
<tr><td> <input ....></td></tr> structure. Whereas I would like to see the controls popping up in a new frame and then after I enter data and click 'Submit' would like to see the new row in the table.

Is my question confusing?

Thanks

 

[mwolf00]

I would have the frame already be there, but hidden...

<input type=button value="Add" onCLick="document.getElementById('addFrame').style.display = 'inline'">

<iframe id="addFrame" style="width:300; height: 250; display: none;" src="iframe_form.htm"></iframe>

then the form on iframe_form.htm should be like this

<form action="yourCGIscript.cgi">
<input>
<input type=submit>

then make sure your CGI forces the main page to refresh

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

 

[dvknn]

What does the frame contain? And why are you calling a 'cgi' script?

 

[mwolf00]

How are you accessing the database? ASP? PHP? ColdFusion? Whichever you use, you need to insert the data into the DB from the form in the iFrame. Another way to do that is via a CGI script.

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

 

[dvknn]

I am accessing the database using JSPs. I am curently reading about FRAMES.

Could you show me a simple example (like have a HTML page with a table 2 columns and a row, and have a button 'Add' and show the frame with with these two 'th' fields that you have?

Also, about 'Edit'. (Select a row in the table and click edit, the contents of the row should appear in the frame)

Sorry for asking so much.. But, I am in the learning process

- Thanks