将文本区域设置为显示:无在尝试保存时丢失该值

本文关键字：保存 设置 区域 文本 显示 | 更新日期: 2023-09-27 18:34:32

我有一个文本区域，用户可以在其中输入注释。但是，只有在选中复选框时，才会显示此文本区域，否则将隐藏。但是，当单击保存按钮并将值保存到数据库时，文本区域将返回一个空白值。

文本区域代码：

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

隐藏/显示文本框的复选框：

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

当我从文本区域中删除display:none时，它会保存值。但是在代码中display:none的情况下，它只返回一个空白值，即使当我单击保存按钮时显示文本区域也是如此。

将文本区域设置为显示:无在尝试保存时丢失该值

您可以

切换元素的visibility css 样式：

$("#someSelector").css("visibility", "collapse");
$("#someSelector").css("visibility", "visible");

。如有必要，将其高度设置为子像素值，例如0.001px

回答这个问题：仍然不确定为什么将文本区域设置为 display:none 会导致它丢失值，但将显示设置为 <tr> 标记解决了这个问题。

文本区域代码：

<tr class ="trNotes" style="display:none">
            <td class="tblAddDetail" colspan="10">
                <textarea class="mceEditorWide" id="txtAddDetailNote" rows="30" cols="50" style="width:100%;" runat="server"></textarea>
            </td>
        </tr>

隐藏/显示它的代码：

$('#<%= chkNotes.ClientID %>').change(function () {
        if($(this).is(":checked")) {
                $('.trNotes').show();
            } 
        else { 
                $('.trNotes').hide(); 
            }
    });

将display:none设置为<tr>并为其指定类名不会影响文本区域中的值。

您必须

在文本框中使用属性禁用。 那么只有它不会返回任何内容。如果你使用 display：none 它不会在浏览器中显示文本框，但它会在开机自检时向控制器发送空值

文本框的代码：

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

隐藏/显示文本框的复选框：

 $('#<%= chkNotes.ClientID %>').change(function () {
        if($(this).is(":checked")) {
             $('#<%= txtAddDetailNote.ClientID %>').removeAttr('disabled','disabled').show();
            } 
        else { 
               $('#<%= txtAddDetailNote.ClientID %>').attr('disabled','disabled').hide();
            }
    });

希望这有帮助

我不完全明白你要做什么，你能提供更多代码吗？小提琴？

试试这个：

$('.checkbox').change(function() {
  var ShowHide = $(this).is(":checked") ? $('.mceEditorWide').show() : $('.mceEditorWide').hide();
});

$(document).on('submit', $('form'), function(e) {
  e.preventDefault();
  alert($('.mceEditorWide').val());
})

显示/隐藏文本区域有一个更简单的实现，当您提交表单时，您可以看到文本区域的值被提醒。

下面是一个工作示例：

https://jsfiddle.net/nebulousal/4bnjfLc8/

此外，您可以插入自己的代码来拦截表单提交，并在发送之前对要发送到服务器的实际数据执行任何操作：

$(document).on('submit', $('form'), function(e) {
  e.preventDefault();
  //Do whatever you want to do to any data in the form
  //Then send it off to the server
})
相关文章：