@@ -54,9 +54,53 @@ The following example shows a PHTML file using the script:
54
54
</script >
55
55
```
56
56
57
- The following example shows a PHTML file using the script with some data:
57
+ The following example shows a PHTML file using the script with some data for a couple of fields :
58
58
59
59
``` html
60
+ <div class =" row-builder-example" >
61
+ <div id =" max-rows-message" style =" display : none ;" class =" message notice limit" role =" alert" >
62
+ <span >Number of rows exceeded.</span >
63
+ </div >
64
+ <button type =" button" id =" add-row-button" class =" action add" >
65
+ <span >Add Item</span >
66
+ </button >
67
+ <div id =" row-container" ></div >
68
+ </div >
69
+
70
+ <script id =" row-template" type =" text/x-magento-template" >
71
+ < div>
72
+ < div class = " field name required" >
73
+ < label for = " field1-name<%- data._index_ %>" class = " label" >< span> Item < %- data ._index_ % > Field< / span>< / label>
74
+ < div class = " control" >
75
+ < input name= " field1[name][<%- data._index_ %>]" type= " text" title= " <?= $block->escapeHtmlAttr(__('Name')) ?>" class = " input-text"
76
+ id= " field1-name<%- data._index_ %>" / >
77
+ < / div>
78
+ < / div>
79
+ < div class = " field name required" >
80
+ < label for = " field2-name<%- data._index_ %>" class = " label" >< span> Item < %- data ._index_ % > Field< / span>< / label>
81
+ < div class = " control" >
82
+ < input name= " field2[name][<%- data._index_ %>]" type= " text" title= " <?= $block->escapeHtmlAttr(__('Name')) ?>" class = " input-text"
83
+ id= " field2-name<%- data._index_ %>" / >
84
+ < / div>
85
+ < / div>
86
+ < div class = " field name required" >
87
+ < label for = " field3-name<%- data._index_ %>" class = " label" >< span> Item < %- data ._index_ % > Field< / span>< / label>
88
+ < div class = " control" >
89
+ < input name= " field3[name][<%- data._index_ %>]" type= " text" title= " <?= $block->escapeHtmlAttr(__('Name')) ?>" class = " input-text"
90
+ id= " field3-name<%- data._index_ %>" / >
91
+ < / div>
92
+ < / div>
93
+ < div class = " actions-toolbar" >
94
+ < div class = " secondary" >
95
+ < a href= " #" id= " btn-remove<%- data._index_ %>" class = " action remove"
96
+ title= " Remove Item" >
97
+ < span> Remove Item< / span>
98
+ < / a>
99
+ < / div>
100
+ < / div>
101
+ < / div>
102
+ </script >
103
+
60
104
<script >
61
105
require ([
62
106
' jquery' ,
@@ -90,8 +134,8 @@ The following example shows a PHTML file using the script with some data:
90
134
91
135
This is provided during widget instantiation. For example:
92
136
93
- ```
94
- formDataPost : {"formData":formData," templateFields":['field1-name','field2-name'] }
137
+ ``` text
138
+ formDataPost : {"formData": ["field1-name1", "field2-name1", "field3-name1"], " templateFields":['field1-name','field2-name','field3-name']] }
95
139
```
96
140
97
141
-` "formData" ` is the multi-dimensional array of form field values : [[ 'a','b'] ,[ 'c','b']] received from the server and encoded
0 commit comments