在 Handsontable 上,如果有类似的列标题,则第一列单元格的值会自动复制到其他类似的单元格
Posted
技术标签:
【中文标题】在 Handsontable 上,如果有类似的列标题,则第一列单元格的值会自动复制到其他类似的单元格【英文标题】:On Handsontable, if there is similar columns header, then the first columns cell value is auto copied to other similar cell 【发布时间】:2018-05-30 09:01:08 【问题描述】:每当我在第一个单元格中输入一个值时,相同的值就会自动复制到同名的标题单元格中。我们怎样才能阻止这一切?我试图用谷歌搜索这个问题,但没有找到任何合适的解决方案。
代码如下:
$.ajax(
type: "POST",
async: false,
url: url,
data: data,
success: function (res)
grid = new Handsontable(container,
data: [],
rowHeaders: true,
autowidth: false,
autoRowSize:true,
maxRows: 100,
minRows: 15,
width: 'auto',
height: 420,
stretchH: 'all', //this is used to cover the full div
overflow: 'hidden',
colHeaders: res.data.header,
columns: res.data.renderer,
fillHandle:
autoInsertRow: false
,
minSpareRows: 1,
);
);
更新 这是用于创建标题和列表的json
<iframe src="https://pastebin.com/embed_iframe/ind7Savd" style="border:none;width:100%"></iframe>
【问题讨论】:
你能发布数据响应吗? 如果更改标题名称会怎样?像多线 1 和多线 2 ! @AhmadHajjar 如果我更改标题名称,它的工作正常。但它必须相同。 标题可以有相同的名称,我猜你在列jsfiddle.net/fuobfe3L中有相同的数据值 @SudhanshuSaxena 请在此处发布所有社区的答案 【参考方案1】:标题可以包含 duplicate
同名列,但因为 JSON
对象 不能包含重复的键,我们可以将数据分配给不同的键并在相同的标题下使用它
var dataObject = [
id: 1,
flag: 'EUR',
currencyCode: 'EUR',
currency: 'Euro',
level: 0.9033,
units: 'EUR / USD',
asOf: '08/19/2019',
date1: '01',
date2: 'date01',
onedChng: 0.0026
,
id: 2,
flag: 'JPY',
currencyCode: 'JPY',
currency: 'Japanese Yen',
level: 124.3870,
units: 'JPY / USD',
asOf: '08/19/2019',
date1: '02',
date2: 'date02',
onedChng: 0.0001
,
id: 3,
flag: 'GBP',
currencyCode: 'GBP',
currency: 'Pound Sterling',
level: 0.6396,
units: 'GBP / USD',
asOf: '08/19/2019',
date1: '03',
date2: 'date03',
onedChng: 0.00
,
id: 4,
flag: 'CHF',
currencyCode: 'CHF',
currency: 'Swiss Franc',
level: 0.9775,
units: 'CHF / USD',
asOf: '08/19/2019',
date1: '04',
date2: 'date04',
onedChng: 0.0008
,
id: 5,
flag: 'CAD',
currencyCode: 'CAD',
currency: 'Canadian Dollar',
level: 1.3097,
units: 'CAD / USD',
asOf: '08/19/2019',
date1: '05',
date2: 'date05',
onedChng: -0.0005
,
id: 6,
flag: 'AUD',
currencyCode: 'AUD',
currency: 'Australian Dollar',
level: 1.3589,
units: 'AUD / USD',
asOf: '08/19/2019',
date1: '05',
date2: 'date05',
onedChng: 0.0020
,
id: 7,
flag: 'NZD',
currencyCode: 'NZD',
currency: 'New Zealand Dollar',
level: 1.5218,
units: 'NZD / USD',
asOf: '08/19/2019',
date1: '06',
date2: 'date06',
onedChng: -0.0036
,
id: 8,
flag: 'SEK',
currencyCode: 'SEK',
currency: 'Swedish Krona',
level: 8.5280,
units: 'SEK / USD',
asOf: '08/19/2019',
date1: '07',
date2: 'date07',
onedChng: 0.0016
,
id: 9,
flag: 'NOK',
currencyCode: 'NOK',
currency: 'Norwegian Krone',
level: 8.2433,
units: 'NOK / USD',
asOf: '08/19/2019',
date1: '08',
date2: 'date08',
onedChng: 0.0008
,
id: 10,
flag: 'BRL',
currencyCode: 'BRL',
currency: 'Brazilian Real',
level: 3.4806,
units: 'BRL / USD',
asOf: '08/19/2019',
date1: '09',
date2: 'date09',
onedChng: -0.0009
,
id: 11,
flag: 'CNY',
currencyCode: 'CNY',
currency: 'Chinese Yuan',
level: 6.3961,
units: 'CNY / USD',
asOf: '08/19/2019',
date1: '10',
date2: 'date10',
onedChng: 0.0004
,
id: 12,
flag: 'RUB',
currencyCode: 'RUB',
currency: 'Russian Rouble',
level: 65.5980,
units: 'RUB / USD',
asOf: '08/19/2019',
date1: '11',
date2: 'date11',
onedChng: 0.0059
,
];
var currencyCodes = ['EUR', 'JPY', 'GBP', 'CHF', 'CAD', 'AUD', 'NZD', 'SEK', 'NOK', 'BRL', 'CNY', 'RUB', 'INR', 'TRY', 'THB', 'IDR', 'MYR', 'MXN', 'ARS', 'DKK', 'ILS', 'php'];
var flagRenderer = function (instance, td, row, col, prop, value, cellProperties)
var currencyCode = value;
while (td.firstChild)
td.removeChild(td.firstChild);
if (currencyCodes.indexOf(currencyCode) > -1)
var flagElement = document.createElement('DIV');
flagElement.className = 'flag ' + currencyCode.toLowerCase();
td.appendChild(flagElement);
else
var textNode = document.createTextNode(value === null ? '' : value);
td.appendChild(textNode);
;
var hotElement = document.querySelector('#hot');
var hotElementContainer = hotElement.parentNode;
var hotSettings =
data: dataObject,
columns: [
data: 'id',
type: 'numeric',
width: 40
,
data: 'flag',
renderer: flagRenderer
,
data: 'currencyCode',
type: 'text'
,
data: 'currency',
type: 'text'
,
data: 'level',
type: 'numeric',
numericFormat:
pattern: '0.0000'
,
data: 'units',
type: 'text'
,
data: 'asOf',
type: 'date',
dateFormat: 'MM/DD/YYYY'
,
data: 'date1',
type: 'text',
,
data: 'date2',
type: 'text',
,
data: 'onedChng',
type: 'numeric',
numericFormat:
pattern: '0.00%'
],
stretchH: 'all',
width: 805,
autoWrapRow: true,
height: 487,
maxRows: 22,
rowHeaders: true,
colHeaders: [
'ID',
'Country',
'Code',
'Currency',
'Level',
'Units',
'Date',
'Date',
'Date',
'Change'
],
columnSorting:
indicator: true
,
autoColumnSize:
samplingRatio: 23
,
language: 'en-US'
;
var hot = new Handsontable(hotElement, hotSettings);
【讨论】:
以上是关于在 Handsontable 上,如果有类似的列标题,则第一列单元格的值会自动复制到其他类似的单元格的主要内容,如果未能解决你的问题,请参考以下文章