| 1 |
<?php |
| 2 |
/* panel for repetitive fields tutorials */ |
| 3 |
?> |
| 4 |
<div class="container"> |
| 5 |
<div class="row"> |
| 6 |
<div class="columns one-third"> |
| 7 |
<div class="iframe"> |
| 8 |
<iframe src="https://www.youtube-nocookie.com/embed/mcC36e69-eM" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> |
| 9 |
</div> |
| 10 |
<h3> |
| 11 |
Use a table construct for a simple row of repetitive fields, or a tab construct for an entire section of fields. |
| 12 |
</h3> |
| 13 |
<ul> |
| 14 |
<li><a href="https://www.youtube.com/watch?v=mcC36e69-eM&t=390s">00:06:30</a><span> - Creating a table row of fields.</span></li> |
| 15 |
<li><a href="https://www.youtube.com/watch?v=mcC36e69-eM&t=615s">00:10:15</a><span> - adding a table footer.</span></li> |
| 16 |
<li><a href="https://www.youtube.com/watch?v=mcC36e69-eM&t=800s">00:13:20</a><span> - customising table button label</span></li> |
| 17 |
<li><a href="https://www.youtube.com/watch?v=mcC36e69-eM&t=1255s">00:20:55</a><span> - table of fields in notification email</span></li> |
| 18 |
<li><a href="https://www.youtube.com/watch?v=mcC36e69-eM&t=1390s">00:23:10</a><span> - filter mail tags</span></li> |
| 19 |
<li><a href="https://www.youtube.com/watch?v=mcC36e69-eM&t=1593s">00:26:33</a><span> - creating a tabbed section.</span></li> |
| 20 |
</ul> |
| 21 |
</div> |
| 22 |
<div class="columns one-third"> |
| 23 |
<div class="iframe"> |
| 24 |
<iframe src="https://www.youtube-nocookie.com/embed/wTdLVtU_mlU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> |
| 25 |
</div> |
| 26 |
<h3> |
| 27 |
Programmatically managing tables using JavaScript |
| 28 |
</h3> |
| 29 |
<ul> |
| 30 |
<li> |
| 31 |
<a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=112s" dir="auto">00:01:52</a><span dir="auto" class="style-scope yt-formatted-string"> - Inserting paragraphs and other non-field HTML elements in your form.</span> |
| 32 |
</li> |
| 33 |
<li> |
| 34 |
<a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=205s" dir="auto">00:03:25</a><span dir="auto" class="style-scope yt-formatted-string"> - Add custom JavaScript to your form.</span> |
| 35 |
</li> |
| 36 |
<li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=328s" dir="auto">00:05:28</a><span dir="auto" class="style-scope yt-formatted-string"> - Identifying form tables in JavaScript. |
| 37 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=400s" dir="auto">00:06:40</a><span dir="auto" class="style-scope yt-formatted-string"> - Using the table 'ready' event. |
| 38 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=540s" dir="auto">00:09:00</a><span dir="auto" class="style-scope yt-formatted-string"> - Using field 'change' event. |
| 39 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=767s" dir="auto">00:12:47</a><span dir="auto" class="style-scope yt-formatted-string"> - Adding a row to a table. |
| 40 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=884s" dir="auto">00:14:44</a><span dir="auto" class="style-scope yt-formatted-string"> - Count rows in a table. |
| 41 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=922s" dir="auto">00:15:22</a><span dir="auto" class="style-scope yt-formatted-string"> - Switch-off comments. |
| 42 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=1170s" dir="auto">00:19:30</a><span dir="auto" class="style-scope yt-formatted-string"> - Removing rows from a table. |
| 43 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=1260s" dir="auto">00:21:00</a><span dir="auto" class="style-scope yt-formatted-string"> - Toggling the 'Add Row' button. |
| 44 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=1331s" dir="auto">00:22:11</a><span dir="auto" class="style-scope yt-formatted-string"> - Using the row 'added' event. |
| 45 |
</span></li><li><a href="https://www.youtube.com//watch?v=wTdLVtU_mlU&t=1403s" dir="auto">00:23:23</a><span dir="auto" class="style-scope yt-formatted-string"> - Toggling the row delete button.</span></li> |
| 46 |
</ul> |
| 47 |
</div> |
| 48 |
<div class="columns one-third"> |
| 49 |
</div> |
| 50 |
</div> |
| 51 |
</div> |
| 52 |
|