Panel |
---|
borderColor | green |
---|
borderWidth | 1 |
---|
titleBGColor | #ddffcc |
---|
borderStyle | solid |
---|
title | Definition |
---|
|
English |
---|
This tutorial cater for use cases that requires a highly customized spreadsheet. The Spreadsheet form element uses the Handsontable library, specifically version 6.2.2 for Joget Workflow V6. There are a wealth of plugins and APIs in the library documentation to change the cell appearance, cell selection, dynamic data, dynamic validation, and much more. |
Thai |
---|
บทช่วยสอนนี้รองรับกรณีการใช้งานที่ต้องการสเปรดชีตที่กำหนดเองสูง องค์ประกอบแบบฟอร์มสเปรดชีตใช้ไลบรารี Handsontable ซึ่งเป็นรุ่นเฉพาะ 6.2.2 สำหรับ Joget Workflow V6 มีปลั๊กอินและ API มากมายในเอกสารประกอบห้องสมุดเพื่อเปลี่ยนรูปลักษณ์ของเซลล์การเลือกเซลล์ข้อมูลแบบไดนามิกการตรวจสอบความถูกต้องแบบไดนามิกและอื่น ๆ อีกมากมาย |
|
...
Info |
---|
|
In Figure 1, we can add in more spreadsheet properties available in the library documentation. The configuration here is formatted as JSON. Usually for simple configurations, a single object and value in Custom Settings would suffice. But for more complex ones, this configuration can be used in combination with a Custom HTML form element to complete a functionality. Do scroll down below for a few examples referenced from the documentation. Thai |
---|
ในรูปที่ 1 เราสามารถเพิ่มคุณสมบัติสเปรดชีตเพิ่มเติมที่มีอยู่ในเอกสารประกอบของห้องสมุด การกำหนดค่าที่นี่ถูกจัดรูปแบบเป็น JSON ปกติแล้วสำหรับการกำหนดค่าอย่างง่ายวัตถุและค่าเดียวในการตั้งค่าแบบกำหนดเองก็เพียงพอแล้ว แต่สำหรับสิ่งที่ซับซ้อนกว่านี้การกำหนดค่านี้สามารถใช้ร่วมกับองค์ประกอบแบบฟอร์ม HTML ที่กำหนดเองเพื่อใช้งานได้อย่างสมบูรณ์ เลื่อนลงด้านล่างเพื่อดูตัวอย่างจากเอกสาร |
|
Example 1 - Limit Cell Selection
...
After performing example 3 above, we can use the script below to programmatically add new rows into the speadsheet.
Code Block |
---|
|
<script>
var col = hot.countRows();
hot.alter('insert_row', col, 1);
hot.setDataAtCell(col, 0, '-Name-');
hot.setDataAtCell(col, 1, '-Surname-');
hot.setDataAtCell(col, 2, '-Age-')
</script> |
Reference: https://jsfiddle.net/ck4859zm/
...