@jspreadsheet/rowheaderrename

jSpreadsheet Plugin : Row Header rename

Row Header rename is a plugin for rename row header (Index) with custom name

This plugin is Free

What is jSpreadsheet ?

jSpreadsheet, a lightweight Vanilla JavaScript plugin, can help you create exceptional web-based interactive tables and spreadsheets. Compatible with most widely-used spreadsheet software, such as Excel or Google Spreadsheet, it offers users an unrivalled Excel-like user experience. It also works well with prominent modern frameworks and flexibly utilizes a large collection of events, extensions and configurations to meet different application requirements. Impress your clients with a better user experience and a great dynamic interactive data management tool.

• Download jSpreadsheet Pro

Documentation

Dependencies

• jSpreadsheet Pro v8
• or
• jSpreadsheet Pro v9
• or
• jSpreadsheet Pro v10

Options of plugin

Option name	Description	Type	Default Value
headerIndexTitle	For change header text of column index	String	(blank)
rowIndexTitle	For change header row (Index) If set an array : value repeat after last name set If set a function : ryou have 1 parameter : index, return string, If set an object : property = indexrow, value of property = value	String|Array[value, value]|Object {indexrow:value,...}|function (indexRow) {}	null
widthRowIndex	For resize column index	Int|String	50

Use in specifics worksheet

For use this plugin on specifics worksheet, set in option in worksheet the role headerRename

jspreadsheet(document.getElementById('spreadsheet'), {
	worksheets:[{
		...
		role: ["headerRename"],
		...
	},{
		...
		role: "headerRename",
		...
	}],
	...
	plugins: [
      ...
      { name:'rowRename', plugin:jss_rowHeaderRename, options:{headerIndexTitle: "hours", rowIndexTitle:function(rowIndex) {return (rowIndex % 24) + ":00";}}},
      ...  
    ],
    ...
});

Get started

Header on page

<script src="https://cdn.jsdelivr.net/npm/jspreadsheet/dist/index.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jspreadsheet/dist/jspreadsheet.min.css" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.css" type="text/css" />

<script src="/path/to/rowHeaderRename.min.js"></script>

Initialize plugin on jSpreadsheet

jspreadsheet(document.getElementById('spreadsheet'), {
	...
	plugins: [
      ...
      { name:'rowRename', plugin:jss_rowHeaderRename, options:{headerIndexTitle: "hours", rowIndexTitle:function(rowIndex) {return (rowIndex % 24) + ":00";}}},
      ...  
    ],
    ...
});

Example with options with Array

Header on page

<script src="https://cdn.jsdelivr.net/npm/jspreadsheet/dist/index.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jspreadsheet/dist/jspreadsheet.min.css" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.css" type="text/css" />

<script src="/path/to/rowHeaderRename.min.js"></script>

Initialize plugin on jSpreadsheet

jspreadsheet(document.getElementById('spreadsheet'), {
	...
	plugins: [
      ...
      { name:'rowRename', plugin:jss_rowHeaderRename, options:{headerIndexTitle: "Who ?", rowIndexTitle:["Me", "You", "Us"]}},
      ...  
    ],
    ...
});

Example with options with Object

Header on page

<script src="https://cdn.jsdelivr.net/npm/jspreadsheet/dist/index.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jspreadsheet/dist/jspreadsheet.min.css" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.css" type="text/css" />

<script src="/path/to/rowHeaderRename.min.js"></script>

Initialize plugin on jSpreadsheet

jspreadsheet(document.getElementById('spreadsheet'), {
	...
	plugins: [
      ...
      { name:'rowRename', plugin:jss_rowHeaderRename, options:{headerIndexTitle: "Name", rowIndexTitle:{0:"Tom", 1:"Pierre", 2:"Jean", 3:"William"}, widthRowIndex: 100}},
      ...  
    ],
    ...
});

CDN

You can use this CDN link

<script src="https://cdn.jsdelivr.net/gh/GBonnaire/jspreadsheet-plugins-and-editors@latest/plugins/JSSV8/dist/rowHeaderRename.min.js"></script>

NPM

npm install @jspreadsheet/rowheaderrename

import jss_rowHeaderRename from '@jspreadsheet/rowheaderrename';

Copyright and license

Copyright GBonnaire.fr and Code released under the MIT License