muzima-form/DateTimeTestForm.html at master · benamonya/muzima-form · 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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/muzima.css" rel="stylesheet">
    <link href="css/bootstrap-datetimepicker.min.css" rel="stylesheet">
    <link href="css/ui-darkness/jquery-ui-1.10.4.custom.min.css" rel="stylesheet">

    <script src="js/jquery.min.js"></script>
    <script src="js/jquery-ui-1.10.4.custom.min.js"></script>
    <script src="js/jquery.validate.min.js"></script>
    <script src="js/additional-methods.min.js"></script>
    <script src="js/bootstrap-datetimepicker.min.js"></script>
    <script src="js/muzima.js"></script>
    <title>Encounter Date Time Form</title>
    <style>
    </style>
</head>
<body class="col-md-10 col-md-offset-1">
<div id="pre_populate_data"></div>
<form id="date_time_picker" name="date_time_picker">
<h2 class="text-center">Encounter Date Time </h2>

<div class="section">
    <h3>Demographics</h3>
    <div class="form-group">
        <input class="form-control" id="patient.uuid"
               name="patient.uuid" type="hidden" readonly="readonly">
<!--     </div> -->
    <div class="form-group">
        <label for="patient.family_name">Family Name:</label>
        <input class="form-control" id="patient.family_name" name="patient.family_name" type="text"
               readonly="readonly">
    </div>
    <div class="form-group">
        <label for="patient.given_name">Given Name:</label>
        <input class="form-control" id="patient.given_name" name="patient.given_name" type="text"
               readonly="readonly">
    </div>
    <div class="form-group">
        <label for="patient.middle_name">Middle Name:</label>
        <input class="form-control" id="patient.middle_name" name="patient.middle_name" type="text"
               readonly="readonly">
    </div>
    <div class="form-group">
        <label for="patient.sex">Gender:</label>
        <select class="form-control" id="patient.sex" name="patient.sex" disabled="disabled">
            <option value="">...</option>
            <option selected value="M">Male</option>
            <option value="F">Female</option>
        </select>
    </div>
    <div class="form-group">
        <label for="patient.birth_date">Date Of Birth:</label>
        <input class="form-control" id="patient.birth_date" name="patient.birth_date" type="text"
               readonly="readonly" value="01-01-1972">
    </div>
</div>
<div class="section">
    <h3>Encounter Details</h3>

    <div class="form-group">
        <label for="encounter.location_id">Name of Dispensary:<span class="required">*</span></label>
        <input class="form-control valid-location-only" id="encounter.location_id" type="text"
        placeholder="Start typing something..." required="required">
        <input class="form-control" name="encounter.location_id" type="hidden">
    </div>
    <div class="form-group">
        <label for="encounter.provider_id_select">Provider Name:<span class="required">*</span></label>
        <input class="form-control valid-provider-only" id="encounter.provider_id_select"
        type="text" placeholder="Start typing something...">
        <input class="form-control" name="encounter.provider_id_select" type="hidden">
    </div>

    <div class="form-group show_provider_id_text">
        <label for="encounter.provider_id">Provider system-id:<span class="required">*</span></label>
        <input class="form-control checkDigit" id="encounter.provider_id" disabled name="encounter.provider_id"
               type="text" required="required"  placeholder="Provider Id">
    </div>
    <div class="form-group">
        <label for="encounter.encounter_datetime">Encounter Date:<span class="required">*</span></label>
        <input class="form-control datetimepicker nonFutureDate past-date" id="encounter.encounter_datetime"
               name="encounter.encounter_datetime" type="text" readonly="readonly"
               required="required">
    </div>
    <div>
    </div>
    <div class="form-group">
        <input class="form-control" id="encounter.form_uuid" name="encounter.form_uuid"
               type="hidden" required="required">
        <input class="form-control" id="encounter.user_system_id" name="encounter.user_system_id" type="hidden">
    </div>
    <div class="form-group return_date" id="return_date.health_centre">
        <label for="obs.return_date.health_centre">Next Visit Date:</label>
        <input class="form-control datepicker checkFutureDate" data-concept="5096^RETURN VISIT DATE^99DCT"
               id="obs.return_date.health_centre" name="obs.return_date.health_centre" type="text"
               readonly="readonly">
    </div>
</div>
</div>
</form>
</body>
<script type="text/javascript">
$(document).ready(function () {
/* Start - Initialize jQuery Date Time Picker */
    document.setupAutoCompleteDataForProvider('encounter\\.provider_id_select');

    document.setupAutoCompleteData('encounter\\.location_id');
    document.setupValidationForProvider($('#encounter\\.provider_id_select').val(),$("#encounter\\.provider_id"));
    document.setupValidationForLocation($('#encounter\\.location_id').val(),$("encounter\\.location_id"));
});
</script>
</html>