Get or Set Value, Formula, or Formatted Text"

From Documentation
m (correct highlight (via JWB))
 
(26 intermediate revisions by 5 users not shown)
Line 1: Line 1:
 
{{ZKSpreadsheetEssentialsPageHeader}}
 
{{ZKSpreadsheetEssentialsPageHeader}}
 +
 +
 +
{{Deprecated|url=http://books.zkoss.org/wiki/ZK_Spreadsheet_Essentials}}
  
 
__TOC__
 
__TOC__
  
ZK Spreadsheet use Range.getEditText() to get cell's edit tet, and Range.setEditText(text) to set cell's text as input by user.
+
===Purpose===
 
+
ZK Spreadsheet uses <javadoc directory="zss" method="getEditText()">org.zkoss.zss.model.Range</javadoc> to get cell's edit text, and <javadoc directory="zss"  method="setEditText(java.lang.String)">org.zkoss.zss.model.Range</javadoc>to set cell's text as input by the user.
==Scenario==
 
Implement a formula editor to allow user input text, formula etc.
 
For this function, we can use a Combobox to show the current cell, and use Textbox as a editor
 
  
===ZUML Example===
+
===ZUML===
  
<source lang="xml" high="4,6">
+
<source lang="xml" highlight="4,6,8">
 
<zk>
 
<zk>
 
<div width="100%" height="100%" apply="demo.EditorComposer" >
 
<div width="100%" height="100%" apply="demo.EditorComposer" >
Line 28: Line 28:
 
</source>
 
</source>
  
==Current Cell==
+
===Composer===
We can use onCellFocused event to get current focus cell.
+
 
 +
====Current Cell Text====
 +
We can use onCellFocused event to get the current focus cell and display the cell's text.
 +
<source lang="java" highlight="4,9">
 +
public void onCellFocused$spreadsheet(CellEvent event) {
 +
int row = event.getRow();
 +
int col = event.getColumn();
 +
focusCombobox.setText(spreadsheet.getRowtitle(row) + spreadsheet.getColumntitle(col));
 +
 
 +
Worksheet sheet = spreadsheet.getSelectedSheet();
 +
currentCell = Utils.getCell(sheet, row, col);
 +
currentRange = Ranges.range(sheet, row, col);
 +
formulaEditor.setText(currentRange.getEditText());
 +
}
 +
</source>
  
===Cell position===
+
====Cell Position====
First, we need to get the current cell's position. We can get row, column index from CellEvent, then use Spreadsheet.getRowtitle() and Spreadsheet.getColumntitle() to get current cell's title.
+
First, we need to get the current cell's position. We can get row and column index from CellEvent, then use <javadoc directory="zss"  method="getRowtitle(java.lang.String)">org.zkoss.zss.ui.Spreadsheet</javadoc> and <javadoc directory="zss" method="getColumntitle((java.lang.String)">org.zkoss.zss.ui.Spreadsheet</javadoc> to get the current cell's title.
  
<source lang="java" high="4">
+
<source lang="java" highlight="4">
 
public void onCellFocused$spreadsheet(CellEvent event) {
 
public void onCellFocused$spreadsheet(CellEvent event) {
 
int row = event.getRow();
 
int row = event.getRow();
Line 42: Line 56:
 
</source>
 
</source>
  
===Cell value===
+
====Cell Value====
After we get cell's position, we can get cell's value from Range.getEditText()
+
After we get the cell's position, we can get the cell's value from <javadoc directory="zss" method="getEditText()">org.zkoss.zss.model.Range</javadoc>
  
<source lang="java" high="6">
+
<source lang="java" highlight="7">
 
public void onCellFocused$spreadsheet(CellEvent event) {
 
public void onCellFocused$spreadsheet(CellEvent event) {
 
         ...
 
         ...
  
Sheet sheet = spreadsheet.getSelectedSheet();
+
Worksheet sheet = spreadsheet.getSelectedSheet();
 
currentCell = Utils.getCell(sheet, row, col);
 
currentCell = Utils.getCell(sheet, row, col);
 
currentRange = Ranges.range(sheet, row, col);
 
currentRange = Ranges.range(sheet, row, col);
Line 56: Line 70:
 
</source>
 
</source>
  
==Editor==
+
====Editor====
  
For editor, we can use onOK event, which menus when user click '''Enter''' keyboard, set cell's value and make spreadsheet's focus to next cell
+
For editor, we can use the onOK event, which menus when the user click '''Enter''' keyboard, set cell's value and make spreadsheet's focus to the next cell
<source lang="java" high="2,3">
+
<source lang="java" highlight="2,3">
 
public void onOK$formulaEditor() {
 
public void onOK$formulaEditor() {
 
currentRange.setEditText(formulaEditor.getText());
 
currentRange.setEditText(formulaEditor.getText());
Line 66: Line 80:
 
</source>
 
</source>
  
Second, we can also use onChange and onChanging event to get current editor's value and set cell's value
+
Second, we can also use the onChange and onChanging event to get the current editor's value and set the cell's value.
<source lang="java" high="3, 7">
+
<source lang="java" highlight="3, 7">
 
public void onChanging$formulaEditor(InputEvent event) {
 
public void onChanging$formulaEditor(InputEvent event) {
 
if (currentCell.getCellType() != Cell.CELL_TYPE_FORMULA)
 
if (currentCell.getCellType() != Cell.CELL_TYPE_FORMULA)
Line 79: Line 93:
  
 
[[File:ZKSsEss_Spreadsheet_SetValue_Input.png]]
 
[[File:ZKSsEss_Spreadsheet_SetValue_Input.png]]
 +
 +
View the complete source of ZUML [https://code.google.com/p/zkbooks/source/browse/trunk/zssessentials/examples/WebContent/config/editor.zul editor.zul]
 +
 +
View the complete source of composer [https://code.google.com/p/zkbooks/source/browse/trunk/zssessentials/examples/src/org/zkoss/zssessentials/config/EditorComposer.java EditorComposer.java]
  
 
=Version History=
 
=Version History=

Latest revision as of 12:55, 19 January 2022


Get or Set Value, Formula, or Formatted Text




Stop.png This article is out of date, please refer to http://books.zkoss.org/wiki/ZK_Spreadsheet_Essentials for more up to date information.

Purpose

ZK Spreadsheet uses Range.getEditText() to get cell's edit text, and Range.setEditText(String)to set cell's text as input by the user.

ZUML

<zk>
<div width="100%" height="100%" apply="demo.EditorComposer" >
	<div height="3px"></div>
		<combobox id="focusCombobox" mold="rounded"	style="text-align:center;">
		</combobox>
		<textbox id="formulaEditor" cols="100"/>
	<div height="3px"></div>
	<spreadsheet id="spreadsheet" src="/demo_sample.xls"	
			maxrows="200" 
			maxcolumns="40"
			width="100%"
			height="450px"></spreadsheet>
</div>
</zk>

Composer

Current Cell Text

We can use onCellFocused event to get the current focus cell and display the cell's text.

public void onCellFocused$spreadsheet(CellEvent event) {
	int row = event.getRow();
	int col = event.getColumn();
	focusCombobox.setText(spreadsheet.getRowtitle(row) + spreadsheet.getColumntitle(col));

	Worksheet sheet = spreadsheet.getSelectedSheet();
	currentCell = Utils.getCell(sheet, row, col);
	currentRange = Ranges.range(sheet, row, col);
	formulaEditor.setText(currentRange.getEditText());
}

Cell Position

First, we need to get the current cell's position. We can get row and column index from CellEvent, then use Spreadsheet.getRowtitle(String) and Spreadsheet.getColumntitle((String) to get the current cell's title.

public void onCellFocused$spreadsheet(CellEvent event) {
	int row = event.getRow();
	int col = event.getColumn();
	focusCombobox.setText(spreadsheet.getRowtitle(row) + spreadsheet.getColumntitle(col));
 ...

Cell Value

After we get the cell's position, we can get the cell's value from Range.getEditText()

public void onCellFocused$spreadsheet(CellEvent event) {
        ...

	Worksheet sheet = spreadsheet.getSelectedSheet();
	currentCell = Utils.getCell(sheet, row, col);
	currentRange = Ranges.range(sheet, row, col);
	formulaEditor.setText(currentRange.getEditText());
}

Editor

For editor, we can use the onOK event, which menus when the user click Enter keyboard, set cell's value and make spreadsheet's focus to the next cell

public void onOK$formulaEditor() {
	currentRange.setEditText(formulaEditor.getText());
	spreadsheet.focusTo(currentCell.getRowIndex() + 1, currentCell.getColumnIndex());
}

Second, we can also use the onChange and onChanging event to get the current editor's value and set the cell's value.

public void onChanging$formulaEditor(InputEvent event) {
	if (currentCell.getCellType() != Cell.CELL_TYPE_FORMULA)
		currentRange.setEditText(event.getValue());
}
	
public void onChange$formulaEditor() {
	currentRange.setEditText(formulaEditor.getText());
}

ZKSsEss Spreadsheet SetValue Input.png

View the complete source of ZUML editor.zul

View the complete source of composer EditorComposer.java

Version History

Last Update : 2022/01/19


Version Date Content
     


All source code listed in this book is at Github.


Last Update : 2022/01/19

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.