Ticket #8444 (closed bug: invalid)
Table Elements Display Toggle Reloads Flash Content
| Reported by: | hoojini | Owned by: | hoojini |
|---|---|---|---|
| Priority: | undecided | Milestone: | 1.next |
| Component: | effects | Version: | 1.5.1 |
| Keywords: | Cc: | ||
| Blocking: | Blocked by: |
Description
Browser: Firefox 3.5.6
OS: Windows XP
Issue: This bug occurs the first time any <tbody>, <tr>, or <td> is shown using .show() or .toggle() when it has an initial display state of display:none. If the table row or table data is visible when the page initially loads, its display can be toggled with no problems. Toggling the display of the <table> element itself does not produce this bug.
The following HTML can be copied into a new document and saved and will produce the issue in Firefox.
<html>
<head>
<title>JQuery Bug</title>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js'></script>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js'></script>
<style type="text/css" media="all">.hidden { display:none;}</style>
</head>
<body>
<h1>JQuery Bug</h1>
<p>This bug occurs the first time any <tbody>, <tr>, or <td> is shown using .show() or .toggle() when it has an initial display state of display:none. If the table row or table data is visible when the page initially loads, its display can be toggled with no problems. Toggling the display of the <table> element itself does not produce this bug.</p>
<div id="flash"></div>
<br/>
<table border="1">
<tbody>
<tr>
<th>Example #1: Table With Initial Display of None</th><th><a rel="bug1" class="buglink" href="#">Click Here</a></th>
</tr>
<tr id="bug1" class="hidden">
<td>TABLE ROW CONTENT</td>
</tr>
</tbody>
</table>
<br/>
<table border="1">
<tbody>
<tr>
<th>Example #2: Table Visible On Load</th><th><a rel="bug2" class="buglink" href="#">Click Here</a></th>
</tr>
<tr id="bug2">
<td>TABLE ROW CONTENT</td>
</tr>
</tbody>
</table>
<h3>Expected Results</h3>
<p>The following changes the css 'display' property, rather than using .toggle() or .show()</p>
<a rel="normal" class="normallink" href="#">Click Here To See Expected</a>
<table border="1">
<tr>
<td><span>TABLE ROW CONTENT SHOWN</span></td>
</tr>
<tr>
<td id="normal" class="hidden"><span>TABLE ROW CONTENT HIDDEN</span></td>
</tr>
</table>
<script type="text/javascript">
var src = "http://www.relentlesstechnology.com/wp-content/uploads/2011/03/jquery-test.swf";
swfobject.embedSWF(src, "flash", "300", "150", "9.0.0", '', {}, {},{id:'flashtest'});
jQuery(document).ready(function(){
jQuery('a.normallink').click(function(e){
jQuery("#"+jQuery(e.target).attr('rel')).css('display', 'table-row');
return false;
});
jQuery('a.buglink').click(function(e){
jQuery("#"+jQuery(e.target).attr('rel')).toggle();
return false;
});
});
</script>
</body>
</html>
Change History
comment:1 Changed 2 years ago by rwaldron
- Owner set to hoojini
- Status changed from new to pending
- Component changed from unfiled to effects
comment:2 Changed 2 years ago by trac-o-bot
- Status changed from pending to closed
- Resolution set to invalid
Because we get so many tickets, we often need to return them to the initial reporter for more information. If that person does not reply within 14 days, the ticket will automatically be closed, and that has happened in this case. If you still are interested in pursuing this issue, feel free to add a comment with the requested information and we will be happy to reopen the ticket if it is still valid. Thanks!
Please follow the bug reporting guidlines and use jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.
Thanks for taking the time to contribute to the jQuery project! Please provide a reduced jsFiddle test case to help us assess your ticket!
Additionally, test against the jQuery 0 GIT version to ensure the issue still exists.