Multiple units view with DB connection

Hello all,

I am relatively new to the DHTMLX Scheduler and have been tasked with creating a system that does a couple of things. We want a scheduler for a list of companies that each has a group of technicians. We are basically creating an appointment calendar for these technicians.

We want to be able to pull the company names/ids from the database and each company will have a list of users that are in the database as well. For example, if Company A logs in, they should see the list of their technicians in a units view that shows their saved appointments. Company B should only see their technicians and not any of Company A’s technicians.

Does anyone have this type of scenario already written or can someone explain to me how I can achieve this goal?

Thanks
Jay

Timeline of Unit view can be used to show list of technicians and their tasks.
To show techicians for the company in question you can embed filtering rules in server side code.

Check

samples\02_customization\shared_events\user_1.html
samples\03_extensions\02_units_view.html
samples\03_extensions\17_connector_units.html
samples\06_timeline\02_lines.html

Ok, so I got this working with hard-coded technician names. If I create another table in the database for company names and one for technician names, how do I reference them so I can replace the hard-coded sections in the unit view?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <title></title>
</head>
        <script src="codebase/dhtmlxscheduler.js" type="text/javascript" charset="utf-8"></script>
        <script src="codebase/ext/dhtmlxscheduler_units.js" type="text/javascript" charset="utf-8"></script>
        <script src="codebase/ext/dhtmlxscheduler_collision.js" type="text/javascript" charset="utf-8"></script>
        <link rel="stylesheet" href="codebase/dhtmlxscheduler_glossy.css" type="text/css" title="no title" charset="utf-8">

<style type="text/css" media="screen">
        html, body{
                margin:0px;
                padding:0px;
                height:100%;
                overflow:hidden;
        }
</style>

<script type="text/javascript" charset="utf-8">
        function init() {
                var sections=[
                        {key:1, label:"James Smith"},
                        {key:2, label:"John Williams"},
                        {key:3, label:"David Miller"},
                        {key:4, label:"Linda Brown"}
                ];
                
                scheduler.locale.labels.unit_tab = "Techs"
                scheduler.locale.labels.section_custom="Asigned to";
                scheduler.config.details_on_create=true;
                scheduler.config.details_on_dblclick=true;
                scheduler.config.xml_date="%Y-%m-%d %H:%i";
                scheduler.config.lightbox.sections=[    
                        {name:"description", height:130, map_to:"text", type:"textarea" , focus:true},
                        {name:"custom", height:23, type:"select", options:sections, map_to:"section_id" },
                        {name:"time", height:72, type:"time", map_to:"auto"}
                ]
                
                scheduler.createUnitsView("unit","section_id",sections);
                
                scheduler.init('scheduler_here',new Date(),"unit");
                //scheduler.load("xml/units.xml?uid="+scheduler.uid());
                scheduler.load("clients/master/events.php?uid="+scheduler.uid());
                var dp = new dataProcessor("clients/master/events.php");
                dp.init(scheduler);
        }
</script>

<body onload="init();">
        <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>
                <div class="dhx_cal_navline">
                        <div class="dhx_cal_prev_button">&nbsp;</div>
                        <div class="dhx_cal_next_button">&nbsp;</div>
                        <div class="dhx_cal_today_button"></div>
                        <div class="dhx_cal_date"></div>
                        <div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
                        <div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>

                        <div class="dhx_cal_tab" name="unit_tab" style="right:280px;"></div>
                        <div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
                </div>
                <div class="dhx_cal_header">
                </div>
                <div class="dhx_cal_data">
                </div>
        </div>
</body>

One of above samples actually implements the same scenario :slight_smile:

samples\03_extensions\17_connector_units.html

on client side

var sections = scheduler.serverList("type");

on server side

$list = new OptionsConnector($res); $list->render_table("types","typeid","typeid(value),name(label)"); $scheduler->set_options("type", $list);

type - name of field in events table which holds foreign key.