在 jqgrid 的多行 EDIT 案例中展开文本
unwrap text in multi line EDIT case in jqgrid
我需要在 jqgrid 中编辑行,但数据是多行的。在我添加的视图模式下将数据显示为多行
function myformatter ( cellvalue, options, rowObject )
{
return cellvalue.split(' ').join('<br/>');
}
但是现在,当我编辑行时,我看到一个
标记,并且这些值再次出现在一行中。有人可以帮我在编辑模式下的单个单元格中换行显示电子邮件吗?
我的网格码:
$(function () {
var mydata =[{
"email": "abc.123@abc.com abc.def@abc.com abc.def@abc.com abc.def@abc.com",
"name": "abc, def",
"address": "USA1"
},
{
"email": "abc.def@abc.com abc.def@abc.com abc.def@abc.com abc.def@abc.com",
"name": "abSFc, def",
"address": "USA2"
},
{
"email": "awwwwwwwwwwwwwbc.def@abc.com",
"name": "abc, def",
"address": "USA3"
},
{
"email": "abc.def@abc.com",
"name": "aDbc, def",
"address": "UK4"
},
{
"email": "FEabc.def@abc.com",
"name": "FDabc, def",
"address": "UK5"
},
{
"email": "abDc.def@abc.com",
"name": "abc, def",
"address": "UK6"
},
{
"email": "abDc.def@abc.com",
"name": "aDbc, def",
"address": "UK7"
},
{
"email": "abDc.def@abc.com",
"name": "abc, def",
"address": "USA8"
},
{
"email": "abDc.def@abc.com",
"name": "abwqewfdec, def",
"address": "USA9"
},
{
"email": "abDc.def@abc.com",
"name": "awvferbc, def",
"address": "USA88"
},
{
"email": "awwwwwwwwwwwwwwwwbc.def@abc.com",
"name": "abwvfwc, def",
"address": "USA"
}];
var lastsel;
$("#list").jqGrid({
datatype: 'local',
data: mydata,
colNames: ['Email', 'Name', 'Address'],
colModel: [
{ name: 'email', width: 250, align: 'center',editable: true,formatter:myformatter
},
{ name: 'name', width: 150, align: 'center',editable: true
},
{ name: 'address', width: 150, editable: true}
],
rowList:[10,20,20],
rowNum:15,
pager: '#pager',
gridview: true,
viewrecords: true,
height: '100%',
width: '50%',
search:true,
loadonce: true,
'cellEdit': true,
//toppager: true,
viewrecords: true,
caption: 'Grid with rowSpan attributes',
editurl: '/Home/GetStudents/',
gridComplete: function () {
var grid = this;
var filters, i, l, rules, rule, iCol, $this = $("#list");
if (this.p.search === true) {
filters = $.parseJSON(this.p.postData.filters);
if (filters !== null && typeof filters.rules !== 'undefined' &&
filters.rules.length > 0) {
rules = filters.rules;
l = rules.length;
for (i = 0; i < l; i++) {
rule = rules[i];
$('body').highlight( rule.data );
}
}
}
/* var $this = $(this), ids = $this.jqGrid('getDataIDs'), i, l = ids.length;
for (i = 0; i < l; i++) {
$this.jqGrid('editRow', ids[i], true);
} */
}
});
var lastSelection;
function editRow(id) {
if (id && id !== lastSelection) {
var grid = $("#list");
grid.jqGrid('restoreRow',lastSelection);
grid.jqGrid('editRow', id, true);
// grid.jqGrid('editRow',id, {keys: true} );
lastSelection = id;
}
}
$("#list").jqGrid('filterToolbar',{stringResult: true, searchOnEnter : false , defaultSearch: 'cn', ignoreCase: true});
//
function myformatter ( cellvalue, options, rowObject )
{
return cellvalue.split(' ').join('<br/>');
}
});
尝试用新行替换< /br>为“\\n”。
return cellvalue.split(' ').join('\n');
我需要在 jqgrid 中编辑行,但数据是多行的。在我添加的视图模式下将数据显示为多行
function myformatter ( cellvalue, options, rowObject )
{
return cellvalue.split(' ').join('<br/>');
}
但是现在,当我编辑行时,我看到一个
标记,并且这些值再次出现在一行中。有人可以帮我在编辑模式下的单个单元格中换行显示电子邮件吗?
我的网格码:
$(function () {
var mydata =[{
"email": "abc.123@abc.com abc.def@abc.com abc.def@abc.com abc.def@abc.com",
"name": "abc, def",
"address": "USA1"
},
{
"email": "abc.def@abc.com abc.def@abc.com abc.def@abc.com abc.def@abc.com",
"name": "abSFc, def",
"address": "USA2"
},
{
"email": "awwwwwwwwwwwwwbc.def@abc.com",
"name": "abc, def",
"address": "USA3"
},
{
"email": "abc.def@abc.com",
"name": "aDbc, def",
"address": "UK4"
},
{
"email": "FEabc.def@abc.com",
"name": "FDabc, def",
"address": "UK5"
},
{
"email": "abDc.def@abc.com",
"name": "abc, def",
"address": "UK6"
},
{
"email": "abDc.def@abc.com",
"name": "aDbc, def",
"address": "UK7"
},
{
"email": "abDc.def@abc.com",
"name": "abc, def",
"address": "USA8"
},
{
"email": "abDc.def@abc.com",
"name": "abwqewfdec, def",
"address": "USA9"
},
{
"email": "abDc.def@abc.com",
"name": "awvferbc, def",
"address": "USA88"
},
{
"email": "awwwwwwwwwwwwwwwwbc.def@abc.com",
"name": "abwvfwc, def",
"address": "USA"
}];
var lastsel;
$("#list").jqGrid({
datatype: 'local',
data: mydata,
colNames: ['Email', 'Name', 'Address'],
colModel: [
{ name: 'email', width: 250, align: 'center',editable: true,formatter:myformatter
},
{ name: 'name', width: 150, align: 'center',editable: true
},
{ name: 'address', width: 150, editable: true}
],
rowList:[10,20,20],
rowNum:15,
pager: '#pager',
gridview: true,
viewrecords: true,
height: '100%',
width: '50%',
search:true,
loadonce: true,
'cellEdit': true,
//toppager: true,
viewrecords: true,
caption: 'Grid with rowSpan attributes',
editurl: '/Home/GetStudents/',
gridComplete: function () {
var grid = this;
var filters, i, l, rules, rule, iCol, $this = $("#list");
if (this.p.search === true) {
filters = $.parseJSON(this.p.postData.filters);
if (filters !== null && typeof filters.rules !== 'undefined' &&
filters.rules.length > 0) {
rules = filters.rules;
l = rules.length;
for (i = 0; i < l; i++) {
rule = rules[i];
$('body').highlight( rule.data );
}
}
}
/* var $this = $(this), ids = $this.jqGrid('getDataIDs'), i, l = ids.length;
for (i = 0; i < l; i++) {
$this.jqGrid('editRow', ids[i], true);
} */
}
});
var lastSelection;
function editRow(id) {
if (id && id !== lastSelection) {
var grid = $("#list");
grid.jqGrid('restoreRow',lastSelection);
grid.jqGrid('editRow', id, true);
// grid.jqGrid('editRow',id, {keys: true} );
lastSelection = id;
}
}
$("#list").jqGrid('filterToolbar',{stringResult: true, searchOnEnter : false , defaultSearch: 'cn', ignoreCase: true});
//
function myformatter ( cellvalue, options, rowObject )
{
return cellvalue.split(' ').join('<br/>');
}
});
尝试用新行替换< /br>为“\\n”。
return cellvalue.split(' ').join('\n');