@jspreadsheet/syncinput

jSpreadsheet Plugin : sync Input

The syncInput plugin sync data of jSpreadsheet in Input hidden.

This plugin is Free

Features

• Sync data in input hidden

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

Documentation

Dependencies

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

Options of plugin

Option name	Description	Type	Default Value
checkRow	Function for checkRow before add in sync value	Function (row data, instance of jSpreadsheet, index rows) → should return true or false	null
fieldsRequired	Array of index columns or name columns who are not empty	Array	[]
inputElement	DOMElement of input	DOMElement	null
inputId	Id of Element, if element not exist, plugin create input with id=inputId and name=inputId, id inputId is null by default input is jSpreadsheet_DATA	String	null
processedValues	get processed value (replace formula by value)	Boolean	true
worksheetId	synchronize specifics worksheet identify with worksheetId, by default it's first worksheet loaded	String or Array of Id	null

if you have a lot a plugins, add on the top autoWidth

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/syncInput.min.js"></script>

Initialize plugin on jSpreadsheet

jspreadsheet(document.getElementById('spreadsheet'), {
	...
	plugins: [
      ...
      { name:'syncInput', plugin:jss_syncInput, options:{inputId:'IdMyInput'} },
      ...  
    ],
    ...
});

CDN

You can use this CDN link

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

NPM

npm install @jspreadsheet/syncinput

import jss_syncInput from '@jspreadsheet/syncinput';

Copyright and license

Copyright GBonnaire.fr and Code released under the MIT License