easyui textarea回车导致datagrid 数据无法展示的问题
textarea换行
在easyui中的datagrid中使用行内编辑时textarea的换行保存到mysql数据库为\n
在textarea中输入回车符 在js读取textarea中的值有\r\n然后到业务层转换到string中就有可能变成空格形式然后被存入数据库,当在取出此值的时候则会变成空格的形式,因此我们需要将不显示的\r\n替换一下。
在js取textarea的时候:
如果用
var str = document.getElementById("textarea").value;
str = str.replace("\r\n","<br>");
则只会将第一个\r\n替换成<br>,如何将所有n个\r\n替换成<br>呢?难道要无限个replace吗?
其实不用,replace可以和正则表达式结合,一次替换所有的\r\n。
var reg=new RegExp("\r\n","g");
str= str.replace(reg,"\r\n");
这样str中所有的\r\n就替换成<br>了.然后可以将其存入数据库。
在取出的时候 只用将值在替换回来即可
var reg=new RegExp("<br>","g");
stt= str.replace(reg,"\r\n");
document.getElementById("textarea").value=str;
更加详细的分析和应用可以参考JavaScript的replace方法与正则表达式结合应用讲解
下面是我写的2个函数 直接放到通用包中 以后使用可以替换
function replaceTextarea1(str){
var reg=new RegExp("\r\n","g");
var reg1=new RegExp(" ","g");
str = str.replace(reg,"<br>");
str = str.replace(reg1,"<p>");
return str;
}
function replaceTextarea2(str){
var reg=new RegExp("<br>","g");
var reg1=new RegExp("<p>","g");
str = str.replace(reg,"\r\n");
str = str.replace(reg1," ");
return str;
}
2. html中通<textarea>标签提交的内容会将回车转变成"\r\n",再将提交的内容放入<textarea>标签中显示时,回车符会还原成正常的换行。
但当带有"\r\n"的字符串放在html的普通文本域中显示时 ,原来的换行效果会转变成空格,因此,需要在显示前将字符串中的"\r\n"替换为"</br>"。
另外,还有一点需要注意:EL表达式会将"</br>"换行符转变成"</br>","<"和">"分别对应"<"和">",也就是说,到了页面上,还是显示为"</br>"(呵呵,EL的智能化程度太高了),为了补救这一点,需要使用jsp标签(<%= %>)来进行显示。
所以当需要在普通文本域中显示由<textarea>提交的内容时,可以直接在数据库里存储不经过处理的字符串,而只在显示前将"\r\n"替换为"</br>",然后在页面上使用<%= %>来显示这些内容.
3. 如果将通过textbox提交到数据库中的空格和回车正确显示出来
public string MyReplace(string mystr)
{
if(mystr == null || mystr == "" )
{
return(" ");
}
else
{
mystr = mystr.Replace("\n\r","<br>");
mystr = mystr.Replace("\r","<br>");
mystr = mystr.Replace("\t"," ");
return(mystr);
}
}
easyui textarea回车导致datagrid 数据无法展示的问题的更多相关文章
- 数据网格和树-EasyUI Datagrid 数据网格、EasyUI Propertygrid 属性网格、EasyUI Tree 树、EasyUI Treegrid 树形网格
EasyUI Datagrid 数据网格 扩展自 $.fn.panel.defaults.通过 $.fn.datagrid.defaults 重写默认的 defaults. 数据网格(datagrid ...
- 第二百二十二节,jQuery EasyUI,DataGrid(数据表格)组件
jQuery EasyUI,DataGrid(数据表格)组件 学习要点: 1.加载方式 2.分页功能 本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于 Pa ...
- EasyUI:datagrid数据汇总
EasyUI:datagrid数据汇总 js代码: var total=0;//全局变量 $(function(){ $('#tablebudgetdata').datagrid({ title:' ...
- 解决:HTML中多文本域(textarea)回车后数据存入数据库,EL表达式取出异常。
问题描述: 当多文本域(textarea)回车后数据存入数据库. EL表达式取出异常,值换行倒置页面报错. 问题解决: 存值脚本代码,提交前转换\n为<br/>. <script t ...
- EasyUI datagrid数据表格的函数getData返回来的是什么
EasyUI datagrid数据表格的函数getData返回来的是什么? 他返回来的是这么一个对象: Object { rows=[10], total=15} 其中rows就是每一行的数据,是这些 ...
- 扩充 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- easyui导出当前datagrid数据(含表头)
JS代码 //导出当前DataGrid数据 function doExportCommon() { var list = getCheckedRowCommon(); var exportList = ...
- JQuery Easy Ui dataGrid 数据表格 ---制作查询下拉菜单
JQuery Easy Ui dataGrid 数据表格 数据表格 - DataGrid 继承$.fn.panel.defaults,使用$.fn.datagrid.defaults重载默认值.. 数 ...
随机推荐
- KnockoutJS 3.X API 第四章 数据绑定(2) 控制流foreach绑定
foreach绑定 foreach绑定主要用于循环展示监控数组属性中的每一个元素,一般用于table标签中 假设你有一个监控属性数组,每当您添加,删除或重新排序数组项时,绑定将有效地更新UI的DOM- ...
- 【转】Spring MVC中Session的正确用法之我见
Spring MVC是个非常优秀的框架,其优秀之处继承自Spring本身依赖注入(Dependency Injection)的强大的模块化和可配置性,其设计处处透露着易用性.可复用性与易集成性.优良的 ...
- C++中“类”相关知识点汇总
一:类中默认的成员函数 一个空的class在C++编译器处理过后就不再为空,编译器会自动地为我们声明一些member function,如果你写 class Empty{}; 就相当于: class ...
- NodeJs连接Oracle数据库
nodejs连接oracle数据库,各个平台的官方详情文档:https://github.com/oracle/node-oracledb/blob/master/INSTALL.md 我的nodej ...
- c#连接mysql环境配置
写.net的时候一直用的都是sql sever,mysql小 有命令行方便就想试了一下,网上搜很久,下载很多配置文件都不成功.昨晚上搞到两点多,冒着生命危险. 后来终于在一个网站上找到这个 MySQL ...
- php基础教程-语法
PHP 脚本可放置于文档中的任何位置.PHP 脚本以 <?php 开头,以 ?> 结尾: <?php // 此处是 PHP 代码 ?> PHP 文件的默认文件扩展名是 &quo ...
- 什么是WeakHashMap--转
原文地址:http://laravel.iteye.com/blog/2303244 Java WeakHashMap 到底Weak在哪里,它真的很弱吗?WeakHashMap 的适用场景是什么,使用 ...
- Effeckt.css – CSS3 Transitions & Animations 精妙应用
CSS3 不仅仅用作界面效果补充,还可以用来替换传统的一些界面实现,而且效果更酷.Effeckt.css 收集了众多精妙的 CSS3 Transitions & Animations 效果应用 ...
- web中的触摸(touch)与手势(gesture)事件
一.触摸事件(TouchEvent): 事件: touchstart:当手指触摸屏幕时触发:即使已经有一个手指放在了屏幕上也会触发 touchmove:当手指在屏幕上滑动时连续的触发.调用preven ...
- JavaScript DOM学习总结(一)
DOM 什么是DOM?简单地说DOM是一套对文档内容进行抽象和概念化的方法. W3C给出的DOM定义是这样的:"一个与系统平台和编程语言无关的接口,程序和脚本以通过这个接口动态的访问和修 ...