ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

Jspreadsheet v4: The javascript spreadsheet

2022-05-10 20:04:53  阅读:580  来源: 互联网

标签:javascript v4 spreadsheet how Jspreadsheet New your


Jspreadsheet v4: The javascript spreadsheet

Jexcel has been renamed to Jspreadsheet.

Jspreadsheet is a lightweight vanilla javascript plugin to create amazing web-based online interactive tables and spreadsheets compatible with other spreadsheet software. You can create an online spreadsheet table from a JS array, JSON, CSV or XSLX files. You can copy from excel and paste straight to your online spreadsheet and vice versa. It is very easy to integrate any third party javascript plugins to create your own custom columns, custom editors, and customize any feature into your application. Jspreadsheet has plenty of different input options through its native column types to cover the most common web-based application requirements. It is a complete solution for web data management. Create amazing online spreadsheets with Jspreadsheet.


For enterprise projects go Pro Version (exclusive features, plugins, extensions and technical support). You can test our Pro Version in development for free for as long as you need.


With a few simple steps, you can have Jspreadsheet integrated into your applications. Impress your clients with better user experience with this amazing data interactive tool.

  • Make rich and user-friendly web interfaces and applications
  • You can easily handle complicated data inputs in a way users are used to
  • Improve your user software experience
  • Create rich CRUDS and beautiful UI
  • Compatibility with excel spreadsheets: users can move data around with common copy and paste shortcuts
  • Easy customizations with easy third-party plugin integrations
  • Lean, fast and simple to use
  • Thousands of successfully user cases
  • Speed up your work dealing with difficult data entry in a web-based software
  • Create and share amazing online spreadsheets

Create amazing online spreadsheets

A example how to embed a simple javascript spreadsheet in your application. You can check out for more examples here.

  Car Make Available Photo Stock Price G
1 Jazz Honda 12/02/2019 $ 2.000,00  
2 Civic Honda 11/07/2018   $ 4.000,01  
 

Installation

  1. % npm install jspreadsheet-ce
Or download from our Github Official

Spreadsheet source code example

  1. <html>
  2. <script src="https://bossanova.uk/jspreadsheet/v4/jexcel.js"></script>
  3. <link rel="stylesheet" href="https://bossanova.uk/jspreadsheet/v4/jexcel.css" type="text/css" />
  4.  
  5. <script src="https://jsuites.net/v4/jsuites.js"></script>
  6. <link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" />
  7.  
  8. <div id="spreadsheet"></div>
  9.  
  10. <script>
  11. var data = [
  12. ['Jazz', 'Honda', '2019-02-12', '', true, '$ 2.000,00', '#777700'],
  13. ['Civic', 'Honda', '2018-07-11', '', true, '$ 4.000,01', '#007777'],
  14. ];
  15.  
  16. jspreadsheet(document.getElementById('spreadsheet'), {
  17. data:data,
  18. columns: [
  19. {
  20. type: 'text',
  21. title:'Car',
  22. width:90
  23. },
  24. {
  25. type: 'dropdown',
  26. title:'Make',
  27. width:120,
  28. source:[
  29. "Alfa Romeo",
  30. "Audi",
  31. "Bmw",
  32. "Chevrolet",
  33. "Chrystler",
  34. // (...)
  35. ]
  36. },
  37. {
  38. type: 'calendar',
  39. title:'Available',
  40. width:120
  41. },
  42. {
  43. type: 'image',
  44. title:'Photo',
  45. width:120
  46. },
  47. {
  48. type: 'checkbox',
  49. title:'Stock',
  50. width:80
  51. },
  52. {
  53. type: 'numeric',
  54. title:'Price',
  55. mask:'$ #.##,00',
  56. width:80,
  57. decimal:','
  58. },
  59. {
  60. type: 'color',
  61. width:80,
  62. render:'square',
  63. },
  64. ]
  65. });
  66. </script>
  67. </html>




Jspreadsheet History

Jspreadsheet 4.6.0

  • Jexcel is renamed to Jpreadsheet
  • Integration with Jsuites v4

Jspreadsheet 4.2.3

  • The spreadsheet plugin now compatible with Jsuites v3.
  • New flags, security implementation
  • New DOM element references in the Toolbar and tabs spreadsheet worksheet events

4.0.0

A special thank to the FDL - Fonds de Dotation du Libre support and sponsorship that make the new online spreadsheet version possible with so many nice features.

  • The online spreadsheet with Support workbooks/tabs
  • Create a dynamic spreadsheet table from a HTML static element
  • Highlight the selected cells in the spreadsheet after CTRL+C
  • Footer with formula support
  • Multiple columns resize
  • JSON update support (Helpers to update a remote server)
  • Javascript spreadsheet global super event (centralized method to dispatch all events in one)
  • Custom helpers: =PROGRESS (progressbar), =RATING (5 star rating)
  • Custom helpers: =COLUMN, =ROW, =CELL, =TABLE, =VALUE information to be used on formula execution
  • Dynamic nested header updates
  • A new column type for HTML editing
  • New flags such as: includeHeadersOnCopy, persistance, filters, autoCasting, freezeColumns
  • New events such as: onevent, onchangepage, onbeforesave, onsave
  • More examples and documentation

Jspreadsheet 3.9.0

  • New methods
  • General fixes

Jspreadsheet 3.6.0

  • Better spreadsheet formula parsing
  • New javascript spreadsheet events
  • New initialization options
  • General fixes

Jspreadsheet 3.2.3

  • getMeta, setMeta methods
  • Npm package with jSuites
  • General fixes

Jspreadsheet 3.0.1

Jspreadsheet v3 is a complete rebuilt of the javascript spreasheet jquery plugin version. For that reason it was not possible to keep a complete compatibility with the previous version. If you are upgraging you might need to implement a few updates in your code. If you have questions, you can review the article upgraging from Jspreadsheet Spreadsheet v2 or Handsontable.

The Jspreadsheet v3 brings lot of great new features:

  • Drag and drop columns
  • Resizable rows
  • Merge columns
  • Search
  • Pagination
  • Lazy loading
  • Full screen flag
  • Image upload
  • Native color picker
  • Better mobile compatibility
  • Better nested headers compatibily
  • Amazing keyboard navegation support
  • Better hidden column management
  • Great data picker: dropdown, autocomplete, multiple, group options and icons
  • Importing from XSLX (experimental)

Big improviments are included, such as:

  • Complete new formula engine with no external depencies with much faster results.
  • Absolutely no selectors, means a much faster application
  • New native columns
  • No jQuery is required
  • React, Vue and Angular examples
  • XLXS support using a custom sheetjs (Experimental).

Jspreadsheet 2.1.0

We are glad to bring you the latest jquery plugin version, with the following improvements:

  • Mobile touch fixes
  • Paste fixes & New CSV parser

Jspreadsheet 2.0.0

  • New radio column
  • New dropdown with autocomplete and multiple selection options
  • Header/body separation for a better scroll/column resize behavior and compatibility
  • Better text-wrap including alt+enter excel compatibility
  • New set/get meta information
  • New set/get config parameters
  • New set/get programmatically cell style
  • New set/get cell comments
  • New table custom toolbar
  • New responsive calendar picker

Jspreadsheet 1.5.7

  • Checkbox column type improvements
  • Destroy jquery table updates

Jspreadsheet 1.5.1

  • Spreadsheet data overflow and fixed headers. See an example
  • Navigation improvements

Jspreadsheet 1.5.0

  • Relative insertRow, deleteRow, insertColumn, deleteColumn. See an example
  • Redo, Undo action tracker for insertRow, deleteRow, insertColumn, deleteColumn, moveRow
  • New formula column recursive chain
  • New alternative design option bootstrap-like. See an example
  • updateSettings updates


Javascript spreadsheet examples


  • Using tabs
    Grouping multiple spreasheets in tabs.






  • Search and pagination
    Full spreadsheet example with search and pagination to bring great compatibility for those who love datatables.

  • Column types
    Learn more about the powerful column types. This example brings all native column types and how to create your own custom type.

  • Advanced dropdown
    Full examples on how to handle simple, advanced, multiple, autocomplete and conditional dropdowns. Create amazing javascript tables using categories and images in your dropdowns.


  • Images
    This examples shows how to embed and upload images to your spreadsheet



  • Table Style
    Bring a very special touch to your applications customizing your javascript spreadsheet.


  • Events
    Learn how to handle events on Jspreadsheet

  • Importing data
    How to import data from an external CSV, json file or XLSX.

  • Formulas
    Unleash the power of your tables bringing formulas and custom javascript methods on your Jspreadsheet spreadsheet.

  • Custom toolbars
    Full example on how to enable nor customize your javascript spreadsheet toolbar.


  • Headers
    Header updates and column dragging

  • Nested headers
    Enabled nested headers in your spreadsheet and learn how to set or get header values


  • Translations
    How to translate the default messages from Jspreadsheet

  • Meta information
    Keep hidden information about your cells using meta information methods

  • Merged cells
    Full example on how to handle merge cells in your javascript tables.



  • Lazy loading
    This example brings a very nice feature to deal with large table datasets.


  • Table overflow
    How define a fixed width and height for the jspreadsheet tables.

  • Column filters
    How to enable column filters on a Jspreadsheet - the online spreadsheet.




Copyright and license

Jspreadsheet is released under the MIT license.

The software is registered under UK law. Contact contact@jspreadsheet.com



About Jspreadsheet

The Jspreadsheet is a full original javascript software created to facilitate the data manipulation in web based applications. It was created to be an easy javascript data input tool for users and it was created inspired on other spreadsheet software.

This software is free and was created to be a light alternative to create amazing online javascript spreadsheets.

标签:javascript,v4,spreadsheet,how,Jspreadsheet,New,your
来源: https://www.cnblogs.com/sexintercourse/p/16255007.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有