WebSheetDataInput

Use Case 3: Web Form Data Input

It's easy to implement data input with Web Sheet as it keeps all the Excel's formula functions.

The only thing you need to do is unlock the input cells and lock other readonly cells.

Demo

How to use web sheet component to input data

Unlock the cells which need input data

Lock all other cells which only for display.

ABCDE
1
2My budget
3Add your spending limit here:
4$24,000.00
5
6PercentYearlyMonthly
7CategoriesAdd your spending percentages here:
8Housing (mortgage, rent)$4,800$400.00
9Food (groceries)$1,920$160.00
10Auto (loan, maintenance)$1,920$160.00
11Savings$1,920$160.00
12Debt$1,680$140.00
13Ent/Rec/Eating-out/Vacations$1,680$140.00
14Clothing$1,440$120.00
15Insurance (auto, home, life)$1,440$120.00
16Medical/Dental/Eye$1,200$100.00
17Misc$1,200$100.00
18School/Childcare/Tuition$1,200$100.00
19Investments/Stocks/Bonds/Mutual Funds/other$1,200$100.00
20
21
22
2390.00%$21,600.00$1,800.00
24
25* This budget is meant to be a starting point to help you begin to budget. Hire a professional financial consultant if you want a fuller understanding of your finances.

Source code
<h3>How to use web sheet component to input data</h3>

<p>Unlock the cells which need input data</p>
<p>Lock all other cells which only for display.</p>
<h:form id="form1">


    <tie:websheet id="sheet1" webSheetBean="#{webSheetDataInput}"
        maxRowsPerPage="30" >
    </tie:websheet>
    
    <p>
    <p:commandButton id="cmdExportResult" value="Export result to Excel"
        ajax="false" actionListener="#{webSheetDataInput.doExport()}">
        <p:fileDownload value="#{webSheetDataInput.exportFile}" />
    </p:commandButton>
    <p:commandButton id="cmdExportTemplate" value="Export template to Excel"
        ajax="false" actionListener="#{webSheetDataInput_Config.doExport()}">
        <p:fileDownload value="#{webSheetDataInput_Config.exportFile}" />
    </p:commandButton>
    </p>            

</h:form>