source: branches/2.2.0.1/calendar/js/dhtmlx/samples/02_customization/16_custom_form.html @ 4001

Revision 4001, 3.1 KB checked in by rafaelraymundo, 13 years ago (diff)

Ticket #1615 - Componente novo para agenda......................................

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
2        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3<head>
4        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
5        <title></title>
6</head>
7        <script src="../../codebase/dhtmlxscheduler.js" type="text/javascript" charset="utf-8"></script>
8        <link rel="stylesheet" href="../../codebase/dhtmlxscheduler.css" type="text/css" media="screen" title="no title" charset="utf-8">
9
10       
11<style type="text/css" media="screen">
12        html, body{
13                margin:0px;
14                padding:0px;
15                height:100%;
16                overflow:hidden;
17        }       
18        #my_form{
19                position:absolute;
20                top:100px;
21                left:200px;
22                z-index:10001;
23                display:none;
24                background-color:white;
25                border:2px outset gray;
26                padding:20px;
27                font-family:Tahoma;
28                font-size:10pt;
29        }
30        #my_form label {
31                width:200px;
32        }
33</style>
34
35<script type="text/javascript" charset="utf-8">
36        function init() {
37               
38                scheduler.config.xml_date="%Y-%m-%d %H:%i";
39                scheduler.config.details_on_dblclick=true;
40                scheduler.config.details_on_create = true;
41               
42                scheduler.init('scheduler_here',null,"week");
43                scheduler.load("../common/events2010.xml");
44               
45        }
46       
47                var html=function(id){ return document.getElementById(id); }; //just a helper
48               
49                scheduler.showLightbox = function(id){
50                        var ev = scheduler.getEvent(id);
51                        scheduler.startLightbox(id, html("my_form") );
52                       
53                        html("description").focus();
54                        html("description").value = ev.text;
55                        html("custom1").value = ev.custom1||"";
56                        html("custom2").value = ev.custom2||"";
57                }
58               
59                function save_form() {
60                        var ev = scheduler.getEvent(scheduler.getState().lightbox_id);
61                        ev.text =        html("description").value;
62                        ev.custom1 = html("custom1").value;
63                        ev.custom2 = html("custom2").value;
64                       
65                        scheduler.endLightbox(true, html("my_form"));
66                }
67                function close_form(argument) {
68                        scheduler.endLightbox(false, html("my_form"));
69                }
70                       
71</script>
72
73<body onload="init();">
74        <div id="my_form">
75                <label for="description">Event text </label><input type="text" name="description" value="" id="description"><br>
76                <label for="custom1">Custom 1 </label><input type="text" name="custom1" value="" id="custom1"><br>
77                <label for="custom2">Custom 2 </label><input type="text" name="custom2" value="" id="custom2"><br><br>
78                <input type="button" name="save" value="Save" id="save" style='width:100px;' onclick="save_form()">
79                <input type="button" name="close" value="Close" id="close" style='width:100px;' onclick="close_form()">
80        </div>
81       
82       
83        <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>
84                <div class="dhx_cal_navline">
85                        <div class="dhx_cal_prev_button">&nbsp;</div>
86                        <div class="dhx_cal_next_button">&nbsp;</div>
87                        <div class="dhx_cal_today_button"></div>
88                        <div class="dhx_cal_date"></div>
89                        <div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
90                        <div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
91                        <div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
92                </div>
93                <div class="dhx_cal_header">
94                </div>
95                <div class="dhx_cal_data">
96                </div>         
97        </div>
98</body>
Note: See TracBrowser for help on using the repository browser.