No announcement yet.
  • Filter
  • Time
Clear All
new posts

    DateChooser skinning issue

    I am skinning DateChooser control, and as part of skinning I'm setting the buttonLayoutControls and adding a spacer between the Cancel and Today buttons.

    This works nicely as long as I have only one date control in my form.
    When my form has two date controls or a DateRange control for that matter, a strange thing happens - when opening the date chooser of each control for the first time or even several times in sequence, everything is OK, but when opening the first date chooser after opening the second date chooser, the spacer seems to get 'lost'.

    Here is simple code snippet to reproduce the issue:
        buttonLayoutControls: [
            isc.LayoutSpacer.create({ width: 60 }),
        ID: "form",
        width: 500, 
        titleOrientation: "top",
        dataSource: "worldDS",
        items: [
            { editorType: "DateRangeItem", allowRelativeDates: true },
    The sequence to reproduce the issue is:
    1. open first date chooser - everything looks right (see first image below).
    2. click Cancel and open the second date chooser - everything still looks right.
    3. click Cancel and open the first date chooser again - the spacer has disappeared (see second image below)
    Click image for larger version

Name:	DateChooser with spacer.png
Views:	103
Size:	27.7 KB
ID:	260733Click image for larger version

Name:	DateChooser with spacer gone.png
Views:	60
Size:	25.5 KB
ID:	260734

    I am using SmartClient build 12.0p 2019-12-04 but the problem is reproduced also with latest build in your showcase page (12.0p 2020-01-12)

    Thanks for looking into this.

    This code is invalid because you are providing an actual instance of LayoutSpacer as a default for the DateChooser class. That means all instances of DateChooser that are created try to share the same, single LayoutSpacer.

    You can correct your code by either passing in just properties for the LayoutSpacer - a plain JavaScript object with _constructor:”LayoutSpacer” - or just using the extraSpace property to add space instead (since you just want a fixed space of 60).


      Thanks - my bad indeed.