CODEWITHSUNDEEP
javascripthtml
tothphu
tothphu

Reputation: 979

textarea value is not shown in the area

I'm scratching my head on the following problem.

I have a tickbox. If it's ticked I show a textarea, with removing style by the below Javascript. At every page load the textarea is hidden with the data loaded between textarea tags. When user clicks on it, it should appear, which it doesn't do! When I inspect it with Firebug or Chrome I see the data where it is supposed to be. In Firebug if I add class="" on-the-fly it appears, but when I add this offline, so it will be present from the page load, it won't.

Sorry for being a little cryptic, this page is part of a bigger embedded webpage, not available on the internet.

Do you have any ideas?

HTML code:

<tr id="my_tr" style="display: none;">
<td colspan="2">
<div id="my_div">
<textarea cols="25" rows="3" name="my_textarea">initial data to be shown</textarea>
</div>
</td>
</tr>

JS code:

function show_hide_my_textarea() {
  var my_checkbox = $(tick_box_ref);
  var my_tr = document.getElementById("my_tr");

  if (my_checkbox.checked == true) {
      my_tr.style.display = '';
  } else {
      my_tr.style.display = 'none';
  }
}

UPDATE: Ah sorry, I didn't explain it corretly. The textarea itself appears, but it remains empty.

Upvotes: 0

Views: 243

Answers (4)

Jasper
Jasper

Reputation: 76003

Instead of setting display to nothing, set it to table-row:

my_tr.style.display = 'table-row';

https://developer.mozilla.org/en/CSS/display <--Update

Upvotes: 2

Will
Will

Reputation: 20235

if (my_checkbox.checked == true) {
    my_tr.style.display = 'table-row';
} else {
    my_tr.style.display = 'none';
}

Settings the display to nothing is invalid, try settings it to table-row. https://developer.mozilla.org/en/CSS/display

Upvotes: 2

allaire
allaire

Reputation: 6045

Put in the first if:

my_tr.style.display = 'block';

instead of leaving it empty, and if it does not work, please paste the rest of the code :)

If it was display: none, you need to specify back display:block so it can be visible again, otherwise it will stay hidden.

Upvotes: 1

user1080894
user1080894

Reputation: 

my_tr.style.display = 'block';

Should do the trick

Upvotes: 1

Related Questions