SimpleFormJs/example.html at main · bobpuley/SimpleFormJs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<html>

<body>
<!-- PROVIDED IN CONLUENCE PAGES -->
<script src="https://code.jquery.com/jquery-3.6.3.min.js" integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>

<!-- FOR EACH GENERATOR -->
<!-- FORM CONFIGURATION -->
<!-- ****EDIT**** -->
<!-- PARAMETERS TEMPLATES -->
<div id="generatorIdMustBeUniqueInThePage">
    <script type="text/javascript">
        $(document).ready(() => {
            const timeZones = ["", "Europe/Paris", "Europe/Madrid"];
            const countries = [{"text":"Andorra", "value":"AD"},{"text":"Czech Republic", "value":"CZ"},{"text":"Danemark", "value":"DK"},{"text":"France", "value":"FR"},{"text":"Niue", "value":"NU"},{"text":"Noorwegen", "value":"NO"},{"text":"Soudan", "value":"SD"},{"text":"Turchia", "value":"TR"},{"text":"Viet Nam", "value":"VN"}];
            let mySchema = [
                {"fieldName": "airportCode", "placeholder": "CDG", "defaultValue":"CDG"},
                {"fieldName": "cityCode", "placeholder": "PAR"},
                {"fieldName": "timeZone", "placeholder": "Europe/Paris", values: timeZones},
                {"fieldName": "countryCode", "placeholder": "France", values: countries},
                {"fieldName": "airportName", "placeholder": "Charles De Gaulle"},
                {"fieldName": "latitude", "placeholder": "49.016667"},
                {"fieldName": "longitude", "placeholder": "2.55"}
            ];
            new ScriptGenerator(mySchema, 'generatorIdMustBeUniqueInThePage');
        });
    </script>

    <!-- OUTPUT TEMPLATES -->
    <script type="text/templates" name="Update">
        airportCode: {{airportCode}}
        cityCode: {{cityCode}}
        timeZone: {{timeZone}}
        countryCode: {{countryCode}}
        airportName: {{airportName}}
        latitude: {{latitude}}
        longitude: {{longitude}}
    </script>
    <script type="text/templates" name="Rollback">
        <b>
            airportCode: {{airportCode}}
            cityCode: {{cityCode}}
            timeZone: {{timeZone}}
            countryCode: {{countryCode}}
            airportName: {{airportName}}
            latitude: {{latitude}}
            longitude: {{longitude}}
        </b>
    </script>
    <!-- ****/EDIT**** -->


</div>

<div id="generatorIdMustBeUniqueInThePage2">
    <script type="text/javascript">
        $(document).ready(() => {
            let mySchema = [
                {"fieldName": "airportCode", "placeholder": "CDG"}
            ];
            new ScriptGenerator(mySchema, 'generatorIdMustBeUniqueInThePage2');
        });
    </script>

    <!-- OUTPUT TEMPLATES -->
    <script type="text/templates" name="Update">
        airportCode: {{airportCode}}
    </script>
    <script type="text/templates" name="Rollback">
        <b>airportCode: {{airportCode}}</b>
    </script>
    <!-- ****/EDIT**** -->
</div>
<!--   ONLY ONCE   -->
<!-- PAGE CONTROLS -->
<!-- page style -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.7/handlebars.min.js" integrity="sha512-RNLkV3d+aLtfcpEyFG8jRbnWHxUqVZozacROI4J2F1sTaDqo1dPQYs01OMi1t1w9Y2FdbSCDSQ2ZVdAC8bzgAg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<link rel="stylesheet" href="simpleform.css" />
<script src="simpleform.js">

</script>

</body>
</html>