Closed
Bug 331029
Opened 18 years ago
Closed 18 years ago
Misplaced form controls in a table after I want to reveal them with javascript
Categories
(Core :: Layout: Tables, defect)
Core
Layout: Tables
Tracking
()
RESOLVED
INVALID
People
(Reporter: d.pontari, Unassigned)
Details
(Keywords: testcase)
Attachments
(2 files)
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; {A918238B-03CD-4FE6-A171-C5A93E74E375}; (R1 1.3)) Build Identifier: I found something similar in bug 140697, but this happens always when I want to reveal a form control changing CSS style. Here there is an example (it works well in IE): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html dir="ltr"> <head> <title>Try form</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <script type="text/javascript"> function showhide (id, set) { divobj = document.getElementById(id); if (set == true) { divobj.style.display = 'block'; } else { divobj.style.display = 'none'; } } </script> </head> <body class="user course-1" id="user-edit"> <form method="post" id="form" enctype="multipart/form-data" action="edit.php"> <div id="page"> <table summary="user data form" class="formtable"> <tr id="firstname_row"> <th>Nome</th> <td> <input type="text" id="firstname" size="30" alt="firstname" maxlength="20" value="" /> </td> </tr><tr id="lastname_row"> <th>Cognome</th> <td> <input type="text" id="lastname" size="30" alt="lastname" maxlength="20" value="" /> </td> </tr><tr id="email_row"> <th>Indirizzo email</th> <td> <input type="text" id="email" size="30" alt="email" maxlength="100" onfocus="showhide ('email_1_row', true)" value="" /> </td> </tr><tr id="email_1_row"> <th>Indirizzo email 2</th> <td> <input type="text" id="email_1" size="30" alt="email_1" maxlength="100" onfocus="showhide ('email_2_row', true)" value="" /> </td> </tr><tr id="email_2_row"> <th>Indirizzo email 3</th> <td> <input type="text" id="email_2" size="30" alt="email_2" maxlength="100" onfocus="showhide ('email_3_row', true)" value="" /> </td> </tr><tr id="email_3_row"> <th>Indirizzo email 4</th> <td> <input type="text" id="email_3" size="30" alt="email_3" maxlength="100" onfocus="showhide ('email_4_row', true)" value="" /> </td> </tr><tr id="email_4_row"> <th>Indirizzo email 5</th> <td> <input type="text" id="email_4" size="30" alt="email_4" maxlength="100" onfocus="showhide ('email_5_row', true)" value="" /> </td> </tr><tr id="email_5_row"> <th>Indirizzo email 6</th> <td> <input type="text" id="email_5" size="30" alt="email_5" maxlength="100" value="" /> </td> </tr><tr> <td colspan="2" style="text-align: center;"><input type="submit" value="Aggiornamento profilo" /></td> </tr> </table> <input type="hidden" name="course" value="1" /> <input type="hidden" name="id" value="4" /> </div> </form> <script type="text/javascript"> showhide ('email_1_row', false); showhide ('email_2_row', false); showhide ('email_3_row', false); showhide ('email_4_row', false); showhide ('email_5_row', false); </script> </body> </html> Reproducible: Always Steps to Reproduce: 1. copy the code I submitted in a file and try it Actual Results: the row (<tr>) I reveal seems to be included in the first <td> tag Expected Results: each row must be in column
Comment 1•18 years ago
|
||
1. load file 2. click into 3rd input ('Indirizzo email')
Comment 2•18 years ago
|
||
Comment 3•18 years ago
|
||
I think this bug is invalid, you have style="display:block" on the table-row, so Mozilla is generating two anonymous table-cells and table-row around that. I think that's all according to what css2.1 says, afaics.
Assignee: general → nobody
Component: General → Layout: Tables
Keywords: testcase
Product: Mozilla Application Suite → Core
QA Contact: general → layout.tables
Version: unspecified → Trunk
Comment 4•18 years ago
|
||
Or this bug is a duplicate of another (invalid) bug, which is very likely.
Reporter | ||
Comment 5•18 years ago
|
||
<tr> I tried with inline option... it's worse.
Comment 6•18 years ago
|
||
Just use display = 'table-row'.
toggle between display:none and display:'' that works crossbrowser. see https://bugzilla.mozilla.org/show_bug.cgi?id=97506#c50
Status: UNCONFIRMED → RESOLVED
Closed: 18 years ago
Resolution: --- → INVALID
Reporter | ||
Comment 8•18 years ago
|
||
Thanks! The solution was 'table-row' property. (instead of Bernd's suggestion seems to me unapplicable with javascript).
You need to log in
before you can comment on or make changes to this bug.
Description
•