Issue:
Would like to have a dynamic (mult-value) table of detail rows for a Lotus Domino web form. The dynmic rows need to be updated on the client side with no round trips adding rows, removing rows, and updating rows.
Solution:
Attached are the snippets of code that Mindwatering uses to build such a form for clients.
JS Header Code:
DetailRow-JSHeadFunctions.rtf
JS OnLoad Code:
DetailRow-JS OnLoad.rtf
Sample Form Layout:
Row | | Item GTIN/UPC | | UPC / Store Number | | Store Item Num. | | Item Damaged | | Item Description |
[D_RowSel]
<br><br> | | [D_UPCIn]
<br><br> | | [D_IsPLUIn]
<br><br> | | [D_PLUIn]
<br><br> | | [D_IsDamageIn]
<br><br> | | [D_DescIn]
<br><br> |
| | | | | | | | | | |
| | <Add / Update Row Btn> | | | | | | | | <Remove Row Btn> |
[D_RowNum]
<br><br> | | [D_UPC]
<br><br> | | [D_IsPLU]
<br><br> | | [D_PLU]
<br><br> | | [D_IsDamage]
<br><br> | | [D_Desc]
<br><br> |
[D_RowSel] - Combox / Editable
Hide/When: Open for Reading
Use formula for choices:
"New"
OnChange Event:
ToggleGetRow();
f.FM_UPCIn.focus();
------
[D_UPCIn] - Text/ Editable
Hide/When: Open for Reading
Default value: ""
Input Translation: ""
HTML Atributes: "Size=\"14\" Maxlength=\"14\""
------
[D_IsPLUIn] - Radio Button / Editable
Hide/When: Open for Reading
Default value: "N"
Enter choices [one per line]:
Yes | Y
No | N
Input Translation: "N" (Optional, include if you want it to reset back to default between saves)
------
[D_ItemNumIn] - Text/ Editable
Hide/When: Open for Reading
Default value: ""
Input Translation: ""
HTML Atributes: "Size=\"9\" Maxlength=\"14\""
------
[D_IsDamgeIn] - Radio Button / Editable
Hide/When: Open for Reading
Default value: "N"
Enter choices [one per line]:
Yes | Y
No | N
Input Translation: "N" (Optional, include if you want it to reset back to default between saves)
------
[D_DescIn] - Text/ Editable
Hide/When: Open for Reading
Default value: ""
Input Translation: ""
HTML Atributes: "Size=\"24\" Maxlength=\"24\""
------
<Add / Update Row > Button Action - Common JavaScript (We have maximum row check here at 16 - 15 is 16 with 0 LBound )
Hide/When: Open for Reading
onClick code:
// validate row values
if(CheckFldMax(f.D_UPCIn, 15) == true) {
return false;
}
if(CheckRowFields() == true) {
UpdateRowFields();
f.D_UPCIn.focus();
} else {
return false;
}
------
<Remove Row > Button Action - Common JavaScript
Hide/When: Open for Reading
onClick code:
// remove the current row selected values from list
RemoveRow();
f.D_UPCIn.focus();
------
[D_RowNum] - Text / Editable / Multi-value (checked)
Multi-Value Options - Separate: Comma, Semicolon, New Line, Blank Line / Display: New Line
Default Value: "0"
Input Translation: @Trim(@ThisValue)
HTML Atributes: "rows=\"16\" cols=\"2\"" (Update 16 to the row limit desired.)
on Focus Event:
f.D_UPCIn.focus;
------
[D_UPC] - Text / Editable / Multi-value (checked)
Multi-Value Options - Separate: Comma, Semicolon, New Line, Blank Line / Display: New Line
Default Value: ""
Input Translation: @Trim(@ThisValue)
HTML Atributes: "rows=\"16\" cols=\"16\"" (Update row 16 to the row limit desired.)
on Focus Event:
f.D_UPCIn.focus;
------
[D_IsPLU] - Text / Editable / Multi-value (checked)
Multi-Value Options - Separate: Comma, Semicolon, New Line, Blank Line / Display: New Line
Default Value: ""
Input Translation: @Trim(@ThisValue)
HTML Atributes: "rows=\"16\" cols=\"5\"" (Update row 16 to the row limit desired.)
on Focus Event:
f.D_UPCIn.focus;
------
[D_PLU] - Text / Editable / Multi-value (checked)
Multi-Value Options - Separate: Comma, Semicolon, New Line, Blank Line / Display: New Line
Default Value: ""
Input Translation: @Trim(@ThisValue)
HTML Atributes: "rows=\"16\" cols=\"16\"" (Update row 16 to the row limit desired.)
on Focus Event:
f.D_UPCIn.focus;
------
[D_IsDamage] - Text / Editable / Multi-value (checked)
Multi-Value Options - Separate: Comma, Semicolon, New Line, Blank Line / Display: New Line
Default Value: ""
Input Translation: @Trim(@ThisValue)
HTML Atributes: "rows=\"16\" cols=\"5\"" (Update row 16 to the row limit desired.)
on Focus Event:
f.D_UPCIn.focus;
------
[D_Desc] - Text / Editable / Multi-value (checked)
Multi-Value Options - Separate: Comma, Semicolon, New Line, Blank Line / Display: New Line
Default Value: ""
Input Translation: @Trim(@ThisValue)
HTML Atributes: "rows=\"16\" cols=\"25\"" (Update row 16 to the row limit desired, cols is one more than line select to make sure no accidental wrapping.)
on Focus Event:
f.D_UPCIn.focus;
------
previous page
|