The first step is creating the html template for the dashboard. Our dashboard is going to enable controlling four appliances, that is, turn them on or off:
- In our dashboard, we need an htmltable where each row on the table represents a device, as follows:
<table> <tr> <td> <input type="checkbox" name="relay" value="relay_0">Motor</input> </br> </td> <td> <input type="radio" name="state_0" value="On">On </input> <input type="radio" name="state_0" value="Off" checked="checked">Off</input> </td> </table>
- In the preceding code snippet, each device state is encapsulated in a data cell <td>, each device is represented by a checkbox, and the device state is represented by an on/off radio button. For example, ...
