handsontable mysql_Handsontable 新增一行 默认值

效果图：

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVYAAACOCAIAAADl17ciAAALCklEQVR4nO2d0XmrvBJFXZQ7oh4XcG4JefdTSvCtIF9aSA3zP0xsBpAAAYLlsNdToviYZSFthHw8vpgQ4sRcjhYQQhyJIkCIU6MIEOLUKAKEODWKACFOjSJAiFOjCBDi1CgChDg1igAhTk31CPi/ECem9vxazx4RUPsQpQCVjGrlkN0MrIcViygCKDCtHLKbgfWwYhFFAAWmlUN2M7AeViyiCKDAtHLIbgbWw4pFFAEUmFYO2c3AelixiCIgz9fternevirbPCnoqH3FDHkSI/vpFfY8vN8cRcDwvN6by74zLGt1uVyae6cl/LojXbd7cxmyUYctSrepE7pdaCoCFgDshdERc28ux8yzlFXTRBtKBDypsRhRBOyOIiCe1+4kC+f795K87RVv2qq5xzH3sus3DrxSjemX4E91a6/ryYyZHQHhIANr596kjPLdPKfnCyMgITneD91lT8GQAA7+IYqAdnyE0dlp7/F1u9ZYKKQjIE6hRARE5a/b1R+XbMy8BB/Ir4dk1kAzIyD+6/Bz9Lk3oTXx4NHLbK7niyIgf9x0PwzSo2BIAAf/EEXA73m9Xi/9s5gbjnUW5LkIaMdjOgKGKjPuZZILiuGvObfkgxO/9jOgG2epB4+vtDM9n9lGSe1WzDxurocLhwRw8A9RBPyOmOvtq78NmFs9ZtfLm1t1L0TJ8RoWqa17sjH5EupGQO9m4Ot27d6ADB88fnOR6fmCVcDM4062LxNDogjo7wV0t9+G6+39VwFPlaYZu1RONGZewi6rgHZvM7eizq4CZvX8ugiYXAXMbFcEZAD2wuQ7AmHDJzFudt4LsNZreOm+N51Lf74x9xI2jIDsXkDr329IbxxkF96V9wLS/RAf/1wvLhVDoghIXnkuv+vW5Hr7dTWubhWPEjasegN0sBJNNqZfwqYRkN5sT7+c7IPb1vZmfKLnN3tHIN0PrcG1aYqGBHDwD1EEUGBaOevdwjbA9mC7DisWUQRQYFo5q93677duC7brsGIRRQAFppVDdjOwHlYsogigwLRyyG4G1sOKRRQBFJhWDtnNwHpYsYgigALTyiG7GVgPKxZRBFBgWjlkNwPrYcUiKiIuREVqz6/1aBVAgWnlkN0MrIcViygCKDCtHLKbgfWwYhFFAAWmlUN2M7AeViyiCKDAtHLIbgbWw4pFFAEUmFYO2c3AelixiCKAAtPKIbsZWA8rFjkgArrFVoafhx1+1HRGe8mnd/MnZvhplvynX7emxGq8fXvmu+VP7hn1FAFmiV74igUt+x/JTxWcyPw8+Aj47OmQOjGvD3/ProGxNfOt8u2Hu2VPLkavW+fjsFgHcfSNQFtJIleJKdferUFRckXMKi2qWrUVs62m2itQ7Nb+dY+FAFZPEWA22Qud4rJl9RtjtaaiNfHcETOvos5W/MEI2OtOZZneDl8apQgwG++FOIn7kRyL3qXaf3/edC9grACmHVb34k0joFKJxRSFeq8NAe0FmB0ZAb0hUrwK6E7Ikjt1rQJKWeS235efLV+k6EbgsAhILMIK9wJWXKK1F1BKmdvuX8u6MALq36goAsySvZBJ38J3BDoDreiqM3/EHP2OQNpqor0CBW5HfC1rQab3SxVrFXBABAy/mnq0uvNY+4Z7Aclvjhw59PaUWOXaD3cbObkEvV6r9gLMjn9H4AiASka1cshuBtbDikUUARSYVg7ZzcB6WLGIIoAC08ohuxlYDysWUQRQYFo5ZDcD62HFIooACkwrh+xmYD2sWEQRQIFp5ZDdDKyHFYsoAigwrRyym4H1sGIRFREXoiK159d6tAqgwLRyyG4G1sOKRRQBFJhWDtnNwHpYsYgigALTyiG7GVgPKxZRBFBgWjlkNwPrYcUiigAKTCuH7GZgPaxYRBFAgWnlkN0MrIcVi/yVIuIln/vcQml78sPlnYqIv/i6XQ8tcOyoiPg0f6OIeFn1h/VKNUgNl7crIv7k63a9Xg+taKIi4nM5+kZgcRHxXhmvkqpeq5WqkLV6r6pBZmb35tLcuXrxr6oadHgELC4iXqN24EylOvyZCLg3l+bO1XuhIuLO+xYR757BkgG3VqkOfyMC2qU2Uu/Vqr2AF+9bRLy/t7NR+dAZSnX4CxEQ77WBej1URNzM3riI+PAJl28HlipV4Y9EQL986B7lhBdGgIqIm9k7FxEPFE6G9Uo1+AsRMPNPWzNbT0XEE7xzEfH2mcpO5BZK2zP6zlZPAFtEPHBwBKiI+FyOfkfgCIBKRrVyyG4G1sOKRRQBFJhWDtnNwHpYsYgigALTyiG7GVgPKxZRBFBgWjlkNwPrYcUiigAKTCuH7GZgPaxYRBFAgWnlkN0MrIcViygCKDCtHLKbgfWwYhEVEReiIrXn13q0CqDAtHLIbgbWw4pFFAEUmFYO2c3AelixiCKAAtPKIbsZWA8rFlEEUGBaOWQ3A+thxSKKAApMK4fsZmA9rFhEEUCBaeWQ3QyshxWLqIj4MqXtyQ+XQWWLpeWSdnDbuUo3XE8RYJboBWYR8XQVwqNLhmQKdXd892C2W/bkYvRURLzP0TcCKiI+aTUcqogIeJocWqXbweopAswme4FXRLytIYgtH9pZzoLn2F5fd7RMT0XEHRUR79rESQUvIv50OqhwmJlN1g7caTOgUE9FxDuoiPiA100/dhXQ/+txQ3mstOlem4FrFim6EVAR8RRxoYHcC+j/FRYB+6xMAgu7TkXEzUxFxH+fNVNb+uh3BF5CuV33na62BXOs/qV1yGw9FRFPoCLiQyfO/wuYUQl7l+k2223k5BL0VEQ8wdHvCBwBUMmoVg7ZzcB6WLGIIoAC08ohuxlYDysWUQRQYFo5ZDcD62HFIooACkwrh+xmYD2sWEQRQIFp5ZDdDKyHFYsoAigwrRyym4H1sGIRRQAFppVDdjOwHlYsoiLiQlSk9vxaj1YBFJhWDtnNwHpYsYgigALTyiG7GVgPKxZRBFBgWjlkNwPrYcUiigAKTCuH7GZgPaxYRBFAgWnlkN0MrIcViygCKExY/Tw+/n08fvay6cLssRdYPaxYRBFw8Ox6MWGlCMiD1cOKRRQBioBpgCcxgtXDikUOiYCfx8e/X16j2of44/P5h3+f3+P/YCul8Nz+9D+Pj9fBcz9vbDTTKtU/nfbQlpJbLA0fylg9rFjkgAj4/mznd/uzD8/XFAsP6lz/OvNwI6X+BbY9RpSKR06/hKpWuf7ptee7a003wocyVg8rFtk9AhIj+zWUk+ve78/+/Fx72Z28EXge8ufx8fF4fLrg92dyMm2TStNWuV/78rnuWtWN8KGM1cOKRQgRkBrKnQjos3LCTe8F+Hz5nSY+98MUqnOXvl0EJLtrVTfChzJWDysWIURA0SqgvpL5QT8f4QLa/jLyEqpaLVwFTLYvcoOB1cOKRVB7AekRP7hV//7e9kYgcTvvd9jPo35/9jbQ9tgL6D3x3AjIdteaboQPZaweViwCe0cgc9Eb7I9vrNQ+f3qxn8uIeu8IDKxmR4Dlu2txN8KHMlYPKxbR/wugwLRyyG4G1sOKRRQBFJhWDtnNwHpYsYgigALTyiG7GVgPKxZRBFBgWjlkNwPrYcUiigAKTCuH7GZgPaxYRBFAgWnlkN0MrIcViygCKDCtHLKbgfWwYhEVEReiIrXn13qqR4AQgowiQIhTowgQ4tQoAoQ4NYoAIU6NIkCIU6MIEOLUKAKEODWKACFOjSJAiFOjCBDi1CgChDg1igAhTo0iQIhTUz0C/ifen9qDRByIIkBMU3uQiAP5D/E6LsRGbR6XAAAAAElFTkSuQmCC" alt="" />

js，代码如下

/*

tpl数组为新增一行所给的默认值，没有的话为空''

*/

var

tpl = ['one', 'two', 'three'],

data = [

['', 'Kia', 'Nissan', 'Toyota', 'Honda'],

['2008', 10, 11, 12, 13],

['2009', 20, 11, 14, 13],

['2009', 30, 15, 12, 13]

],

container = document.getElementById('example1'),

hot1;

/*

*函数isEmptyRow为判断当前的行所述列是否为空，是返回true，

*/

function isEmptyRow(instance, row) {

var rowData = instance.getData()[row];

for (var i = 0, ilen = rowData.length; i < ilen; i++) {

if (rowData[i] !== null) {

return false;

}

}

return true;

}

/*

*函数 defaultValueRenderer 给当前行的列添加默认值

*/

function defaultValueRenderer(instance, td, row, col, prop, value, cellProperties) {

/*

* args 为获取当前列的属性

*/

var args = arguments;

/*

*判断arg[5]的值是否为null，和空值(isEmptyRow，前面已经有相关函数做判断)

*符合条件的列赋值前面所给的数组的当前列的值tpl[col]

*/

if (args[5] === null && isEmptyRow(instance, row)) {

args[5] = tpl[col];

td.style.color = '#999';

}

else {

td.style.color = '';

}

/*

*判断arg[5]的值是否为undefined，和空值(isEmptyRow，前面已经有相关函数做判断)

*符合条件的列赋值前面所给的数组的当前列的值tpl[col]

*/

if (args[5] === undefined && isEmptyRow(instance, row)) {

args[5] = tpl[col];

td.style.color = '#999';

}

else {

td.style.color = '';

}

Handsontable.renderers.TextRenderer.apply(this, args);

}

hot1 = new Handsontable(container, {

startRows: 8,

startCols: 5,

minSpareRows: 1,

contextMenu: true,

/*

*获取行的属性，执行defaultValueRenderer函数进行赋值

*/

cells: function (row, col, prop) {

var cellProperties = {};

cellProperties.renderer = defaultValueRenderer;

return cellProperties;

},

/*

*对当前table做操作前执行的函数，做相应的操作，这个我也没怎么看懂

*/

beforeChange: function (changes) {

var instance = hot1,

ilen = changes.length,

clen = instance.colCount,

rowColumnSeen = {},

rowsToFill = {},

i,

c;

for (i = 0; i < ilen; i++) {

// if oldVal is empty

if (changes[i][2] === null && changes[i][3] !== null) {

if (isEmptyRow(instance, changes[i][0])) {

// add this row/col combination to cache so it will not be overwritten by template

rowColumnSeen[changes[i][0] + '/' + changes[i][1]] = true;

rowsToFill[changes[i][0]] = true;

}

}

}

for (var r in rowsToFill) {

if (rowsToFill.hasOwnProperty(r)) {

for (c = 0; c < clen; c++) {

// if it is not provided by user in this change set, take value from template

if (!rowColumnSeen[r + '/' + c]) {

changes.push([r, c, null, tpl[c]]);

}

}

}

}

}

});

hot1.loadData(data);

es新增字段，并设置默认值

重新设置mapping 添加新的字段. 设置es允许脚本执行:elasticsearch.yml script.inline: true 然后执行脚本 POST linewell_assets_mgt ...

Vue组件库新增的prop属性类型是Object或者Array时默认值的设置

在Vue开发中提供组件库时常常需要添加相关属性,用来接收父组件向子组件传递的数据,通常也会给属性设置默认值,那么当属性的类型是Object或者Array类型时如何设置默认值比较合理呢?下面将揭晓这一过 ...

MySQL数据库innodb&lowbar;rollback&lowbar;on&lowbar;timeout默认值的危害？

http://www.ywnds.com/?p=9560 一.innodb_rollback_on_timeout变量 有时侯会发生事务超时的情况,MySQL会返回类似这样的错误:   1 ERROR ...

ES6函数参数默认值作用域的模拟原理实现与个人的一些推测

一.函数参数默认值中模糊的独立作用域 我在ES6入门学习函数拓展这一篇博客中有记录,当函数的参数使用默认值时,参数会在初始化过程中产生一个独立的作用域,初始化完成作用域会消失:如果不使用参数默认值,不 ...

jeecg小吐槽续——自己折腾修改在线开发功能中&OpenCurlyDoubleQuote;默认值”的使用

-- 原来设置了"默认值"的字段,新建表单时不会出现在表单上,要保存后才能在列表页面出现,而且第二次编辑时,设置了"默认值"的字段再也不能改成空值! -- 要修 ...

&lbrack;转&rsqb;Hibernate设置时间戳的默认值和更新时间的自动更新