@jspreadsheet/rowheaderrename v2.0.4
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.
Documentation
Dependencies
Options of plugin
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