Setting textarea to display:none loses the value when trying to save
<p>I have a textarea where the user can enter in a note. But this textarea will only display if a checkbox is ticked, otherwise it is hidden. 
But when the save button is clicked and it saves the values to the database, the textarea is returning a blank value. </p>

<p>Code for textarea:</p>

<pre><code>&lt;textarea class="mceEditorWide" id="txtAddDetailNote" rows="30" cols="50" style="width:100%;display:none" runat="server"&gt;&lt;/textarea&gt;
</code></pre>

<p>Checkbox that hides/shows textbox:</p>

<pre><code> $('#&lt;%= chkNotes.ClientID %&gt;').change(function () {
        if($(this).is(":checked")) {
             $('#&lt;%= txtAddDetailNote.ClientID %&gt;').show(); 
            } 
        else { 
               $('#&lt;%= txtAddDetailNote.ClientID %&gt;').hide(); 

            }
    });
</code></pre>

<p>When I remove the <code>display:none</code> from the textarea, it saves the value. But with <code>display:none</code> in the code, it only returns a blank value, even though the textarea is displaying when I click the save button. </p>