Simple Machines Community Forum

General Community => Scripting Help => Topic started by: mickjav on October 04, 2022, 01:37:23 PM

Title: colspan Not working
Post by: mickjav on October 04, 2022, 01:37:23 PM
I have the table below which works fine.

I have added a .js function call to show/hide a row As below

$r_detail = ' <a style="text-align: left;"><span onclick="toggle_visibility('.$I.')"><strong>Details</strong></span></a>';
Which shows/hided row below

<tr>
  <td colspan="' . ($add_my_albums  ? '6' : '5') . '" id="' .$I. '" style="display: none;vertical-align: middle">test</td>
  </tr>

The show/Hide works But The colspan will only go to it's default of 1 I've been playing with it but nothing I've tried as got it working.

Any help would be appriciated.

$r_detail = ' <a style="text-align: left;"><span onclick="toggle_visibility('.$I.')"><strong>Details</strong></span></a>';

echo  '<tr>
<td style="text-align: center; width: ' . ($add_my_albums  ? '3%' : '3%') . '; vertical-align: top">' . $row['rel_day'] . '</td>
<td style="text-align: center; width: ' . ($add_my_albums  ? '3%' : '3%') . '; vertical-align: top">' . $row['rel_month'] . '</td>
<td style="text-align: center; width: ' . ($add_my_albums  ? '4%' : '5%') . '; vertical-align: top">' . $row['rel_year'] . '</td>
<td style="text-align: left; width: ' . ($add_my_albums  ? '47%' : '52%') . '; vertical-align: top">' . $link . $combiart . $r_detail . '</td>
<td style="text-align: left; width: ' . ($add_my_albums  ? '35%' : '33%') . '; vertical-align: top">' . $inlink . '</td>'
. $xrow . '
  </tr>
  <tr>
  <td colspan="' . ($add_my_albums  ? '6' : '5') . '" id="' .$I. '" style="display: none;vertical-align: middle">test</td>
  </tr>'

mick
Title: Re: colspan Not working
Post by: mickjav on October 04, 2022, 02:31:04 PM
I've continued playing with it, I removed everything so it only used the column span

<td colspan="' . ($add_my_albums  ? '6' : '5') . '">test</td>
Which worked

So I put the ID and style="display: none" And found that as soon as I called the java function

function toggle_visibility($ID) {
var x = document.getElementById($ID);
if (x.style.display === "none") {
  x.style.display = "block";
} else {
  x.style.display = "none";
}
  }

The colspan set back to 1 so do I need to set the colspan within the above function?
Title: Re: colspan Not working
Post by: live627 on October 04, 2022, 03:35:36 PM
try table-cell instead of block or even an empty string
Title: Re: colspan Not working
Post by: mickjav on October 04, 2022, 03:56:22 PM
Thanks @live627 table-cell worked a treat