AnsweredAssumed Answered

How can I create a custom view with a datetime field in Sugar 7?

Question asked by Robin Larsson on Mar 5, 2014
Latest reply on Mar 28, 2014 by Harald Kuske
Hi,

I have started to really enjoy the new UI model! However, I have now come to a hindrance.

I have created a custom view and included a datetime field. This works fine and the field show up in the GUI.

The problem start when I click on the date field. I expect a calendar to popup, but I get no reaction from the interface. The hour field works and give me a nice drop down with pre-defined values. Both fields gives different JavaScript errors.

The error from date field:
Uncaught TypeError: Cannot read property 'left' of null


The code:

I got a start provided from Sugar developer documentation and own exploring of the code.

I am using the name config because the router already exists. This make it possible to have the url: site_url/#Module/config

* config.php

$viewdefs['Module']['base']['view']['config'] = array(
    'panels' => array(
        array(
            'label' => 'LBL_MODULE_TITLE',
            'fields' => array(
                array(
                    'name' => 'field_name',
                    'type' => 'datetimecombo',
                    'label' => 'LBL_FIELD_NAME',
                    'default' => true,
                    'enabled' => true,
                    'view' => 'edit'
                ),
            ),
        ),
    )
);

* config.hbs

<div class="accordion-heading">
    
</div>
<div class="accordion-inner">
    {{#each meta.panels}}
        <p>{{str "LBL_MODULE_TITLE" "Module"}}</p>
        <ol>
            {{#each fields}}
            
                {{{str label "Title"}}}
                
                <div class="row-fluid control-group {{../name}}">
                    <span class="normal{{#if css}} {{css}}{{/if}} index{{index}}"
                          data-fieldname="{{name}}" data-index="{{index}}">                            
                        {{field ../../this model=../../model}}
                    </span>
                </div>
                
            {{/each}}
        </ol>
    {{/each}}
</div>

The problem seem to be origin from the file "jssource/src_files/include/javascript/twitterbootstrap/bootstrap-datepicker.js" and function place. The offset is not being picked up correctly.

Does anyone have a clue?

Outcomes