var app = angular.module('app', [
'dx'
]);

I am getting this error

Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module dx due to:
Error: [$compile:baddir] Directive name 'DOMComponent' is invalid. The first character must be a lowercase letter
http://errors.angularjs.org/1.4.3/$compile/baddir?p0=DOMComponent
at http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:68:12
at assertValidDirectiveName (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:6905:13)
at $CompileProvider.registerDirective [as directive] (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:6932:7)
at runInvokeQueue (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:4356:35)
at http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:4364:11
at forEach (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:336:20)
at loadModules (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:4346:5)
at http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:4363:40
at forEach (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:336:20)
at loadModules (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js:4346:5)

Such a poweful TreeList doesn't have a pager? Hmm so much for the consistency. :( It's still a grid that has a hierarchy. Why wouldn't you add this support?

Steps to Reproduce:

Issue can be reproduced in this CodePen: https://codepen.io/jaggedaz/pen/ZaPRmE

1. Configure the Scheduler to disable appointment dragging.
2. Add several events to a single day so that the appointment collector drop-down is generated.
3. Click the "More" item to show the appointment collector drop-down.
4. Click and drag one of the appointments out of the collector onto the calendar.

Results You Received:

Allows the user to begin dragging the appointment.

Results You Expected:

Should not allow the user to drag the appointment.

Environment Details:

devexteme version: 17.2.3

Kodus on the new TreeList! Loving it! We're evaluating moving an existing competitors grid to this on a couple of customer projects as it solves a bunch of hacks. Thanks for creating it and supporting such awesome consistency between the grid with the features and APIs like filtering, sorting, columns, selection, etc. I hope you continue to evolve it.

On that note, a couple feature requests / suggestions for it:

• Instead of having to do a tooltip dynamically for the row on mouse over via onRowPrepared why not add to the columns a property that can be mapped to the data field? A couple other grid controls we've used do it this way and it's very handy. Though I realize it would be specific to the cell that way, so maybe having a rows object with a property for that in addition to the cell to satisfy both needs.
• When multiple select is enabled, it would be helpful to control per row whether a row can be selected. Sometimes the parent of the hierarchy should never be selected. Rather than unselecting in onSelectionChanged, the checkbox shouldn't even been shown and would be helpful to control that through a property that can come in the data as a boolean for each item.
• It would be helpful to control per hierarchy parent whether it's automatically expanded or collapsed. Would be helpful to control that through a property that can come in in the data as a boolean for each item.
• For single selection, in addition to support showing that the row is selected, it would be great to also support showing radio buttons and showing the selected radio button instead. Of course like above, it would need to support same as a checkbox not showing on certain items and would be great to control much the same way via data on each item.
• Update the selected row CSS. When rowAlternationEnabled is enabled, a row selection is really hard to tell apart from the dark background of the alternating row.
• Add support for export, including JSON, CSV, XLS/XLSX, and PDF

And of course we'd want you to add this to the other grid controls for consistency as they become useful there too.

I would load custom date names like to load as in messages, how to do this?

This issue can be reproduced with this demo by adding the following options to TreeView:
selectNodesRecursive: false, searchEnabled: true

Steps to reproduce:

1. Set selected: true for any parent node.
2. Search something via the search box.
3. Remove a search value from the search box.
4. The preselected item becomes unselected.

Steps to Reproduce:

1. Create an instance of dxFileUploader with the accept attribute as ".jpg", an arbitrary upload url, and uploadMode to instant
2. Using Drag and Drop, drop a file called "PROFILE.JPG" onto the widget
3. Using Drag and Drop, drop a file called "profile.jpg.bak" onto the widget

Results You Received:

Step 2 - Nothing happens
Step 3 - Upload begins

Results You Expected:

Step 2 - File should have started uploading
Step 3 - File is rejected, upload does not start

Environment Details:

DevExtreme 17.1
Latest Chrome on Windows 10

Steps to Reproduce:

1. unzip DevExtreme_Error-reproduce.zip
2. npm install -g webpack-dev-server
3. npm install
4. webpack-dev-server --config config/webpack.prod.js --watch

Results You Received:

After clicking test Test-button ui/dialog/confirm() is called and resulting with the following error:

ERROR TypeError: Cannot read property 'jQuery3310043683433871879452' of undefined

(or some other random number behind jQuery)

The same problem happens with ui/dialog/notify() ...

Results You Expected:

Expected DevExtreme confirm() and notify() to work without error.
A ugly fix is to comment two lines (4 and 24) in app.module.ts ...

• import { HomeModule } from './home/home.module'; // <--- comment this line and it will work
• HomeModule, // <--- comment this line and it will work

and let the HomeModule only be referenced by Angular Router such way ...

const routes: Routes = [
    // Lazy async modules
    {
        path: '',
        loadChildren: './home/home.module#HomeModule'
    }
];

Environment Details:

Angular.io
JQuery
Webpack2
DevExtreme 17.2.4 (but any version fail same way)

DevExtreme_Error-reproduce.zip

Would be helpful to have a method .clear() and simply do: $("#treeList").dxTreeList('clear') for example instead of having to do:

var instance=$("#treeList");
instance.option('dataSource', []);

Same for DataGrid and PivotGrid.

Took me hours and lots of searching in forums to figure that out whereas this one method could be well documented in API.

Steps to Reproduce:

1. Follow your localization guide for the version above 17.
2. Specify a language other than English.

Results You Received:

The locale is always the same. (But the messages on this control correspond to the selected locale.)

DevExtreme/js/localization/date.js 68 line and 604 line

var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
    days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];```

/*.................*/

    getMonthNames: function(format) {
        return cutCaptions(months, format);
    },

    getDayNames: function(format) {
        return cutCaptions(days, format);
    },

Assumption:
There are no places where the values ​​of these variables change, or other places to which the reference occurs when forming the component.

Results You Expected:

The names of the weeks of the months should be in accordance with the specified locale

Environment Details:

17.1.3 DevExtreme

Если в форме указать поле dxSelectBox с CustomStore с указанными полями displayExpr и valueExpr,
то будет вызван многократное load у CustomStore
Пример
https://codepen.io/anon/pen/JMpXVz

Steps to Reproduce:

1. import { confirm } from 'devextreme/ui/dialog'; to a component

2. use confirm

confirm('My string', '').done(res => {
     if (res === true) {
        location.reload();
    }
});

3. save and rebuild project

Results You Received:

Gets compile error:
error TS2339: Property 'done' does not exist on type 'JQueryPromise<boolean>'.

Results You Expected:

Find another way to get dialogs working again 🥇

Environment Details:

Chrome latest, Win 10, angular 5.0.0-rc.9

"devextreme": "17.2.1-pre-17291",
"devextreme-angular": "17.2.1-beta.3",

fieldset.generic.tests.js

Using 17.2.4, but this was issue in previous releases as well. Users are having difficulty seeing the vertical and horizontal scrollbars. Some don't hover long enough for the scrollbars to appear, and even when they do, the height / width of them is difficult to work with. Please please please add an option to always display the scrollbars in the standard sizes.

Also, when there are a lot of rows in the TreeList, the vertical scrollbar height is so tiny it's very hard to even see it and hard to grab it. Can you spot the vertical scrollbar it in the screenshot?

On the version 17.1.3 doesn't work in a popup edit mode.
https://www.devexpress.com/Support/Center/Example/Details/T334359/dxdatagrid-how-to-implement-cascading-lookup-columns

onToolbarPreparing: function (sender) {
    sender.toolbarOptions.items.unshift({
        widget: "dxMenu",
        location: "after",
        options: {
            selectionMode: 'single',
            focusStateEnabled: true,
            hoverStateEnabled: true,
            showSubmenuMode: {
                name: 'onClick',
            },
            hideSubmenuOnMouseLeave: false,
            items: [{
                text: 'Экспортировать',
                icon: 'export',
                items: [{
                    icon: 'exportxlsx',
                    text: 'Экспортировать всё',
                },
                {
                    icon: 'exportselected',
                    text: 'Экспортировать выбранные строки',
                },
                ]
            },]
        },
    });
},

add code
not hover and spindown ico

Hello, when I'm using devexpressJs, I find some problems with using filxed column in IE browsers.
1, the reset of $(document.body).Click event will expire and will only be triggered by clicking on the text or the border border.
2, using the right-click menu event will fail and will only be triggered by clicking on the text or the border border.
3, when more than 26 data, the last two data in addition to the frozen column (filxed Colmun), the other are merged into a cell.
4, in a lot of time to move to the right, in the IE browser will appear flashing, the experience is not good.

Use Devexreme and devextreme-angular 17.2.4

1. Many methods in ODataStore return Promise. Returned instance not contains method catch
2. I call method ODataStore.insert, if server response set http status 500 then returned promise not call any branch.

If I select a value from a select-box and than I refresh the items/datasource, I lost the current value on the UI because of the reference value change.

Is it possible to override the compare behaviour?

Steps to Reproduce:

This Plunker reproduce the problem.

Results You Expected:

Changing the items/datasource I would like to not lose the current selected value

Environment Details:

OS: MacOs 10.12.6
angular/cli: 1.2.3
node: 6.11.0

Are there any suggestions/examples on how to integrate the devextreme components with the react.js view renderer?

I'm not sure if this is the right place for this question. I originally asked this on StackOverflow, as I thought you guys might be monitoring the "devexpress" and "devextreme" tags, but the question hasn't received many views, so here it is - I hope you can help:

I'm upgrading a project from an older version of DevExpress to the latest version of DevExtreme and having an issue with the pivot grid's OLAP connection. In the old version, we could bind to a connection string as follows:

@Html.DevExpress().PivotGrid(pivotSettings).BindToOLAP("provider=MSOLAP;data source=.;initial catalog=Dashboard AS;cube name=Dashboard Cube").GetHtml()

In the new one, there is no option for a connection string and I am forced to provide a URL for msmdpump.dll.

I followed some of instructions here: Configure HTTP Access to Analysis Services on IIS 8.0

However, that is for IIS and not IIS Express, so I basically just copied the files to /wwwroot/OLAP/ in my new .NET Core application.

My pivot grid has the following definition:

@(Html.DevExtreme().PivotGrid()
	.ID("pivotGrid")
	.Width("100%")
	.AllowSortingBySummary(true)
	.AllowFiltering(true)
	.ShowBorders(true)
	.ShowColumnGrandTotals(true)
	.ShowRowGrandTotals(true)
	.ShowRowTotals(true)
	.ShowColumnTotals(true)
	.FieldChooser(c => c.Enabled(true))
	.DataSource(d => d.RetrieveFields(true)
		.Store(s => s.Xmla()
			.Url("/OLAP/msmdpump.dll")
			.Catalog("Dashboard AS")
			.Cube("Dashboard Cube")
		)
	)
)

and the msmdpump.ini is as follows:

<ConfigurationSettings>
	<ServerName>localhost</ServerName>
	<SessionTimeout>3600</SessionTimeout>
	<ConnectionPoolSize>100</ConnectionPoolSize>
</ConfigurationSettings>

The problem is I keep getting a 404 in the browser console even though the URL is correct:
http://localhost:4116/OLAP/msmdpump.dll

I can't find any instructions for getting msmdpump.dll to work with IIS Express.

I'm thinking maybe IIS Express prevents the browser from accessing DLLs directly? I'm not certain... but it did give me a 404 on the .ini file as well when I tested that. If this is the problem, how do I solve it?

Is it possible for you to make this simpler by allowing an alternative to the Url parameter, so that we don't need to use msmdpump.dll? For example:

.Store(s => s.Xmla()
    .FromConnectionString("provider=MSOLAP;data source=.;initial catalog=Dashboard AS;cube name=Dashboard Cube")
)

or even have a Server parameter so you can build a connection string that way:

.Store(s => s.Xmla()
    .Server("localhost")
    .Catalog("Dashboard AS")
    .Cube("Dashboard Cube")
)

Using 17.1.6, I have 10 rows. 3 of the rows have 1 level of 3 children under them. When I click on SelectAll, if those parent rows a collapsed, the children are never shown as selected via the checkbox. I would expect the behavior to selected the children whether the parent row is expanded or not. You can see this behavior also here, have everything collapsed, tick on select all and expand John Heart: https://js.devexpress.com/Demos/WidgetsGallery/Demo/TreeList/MultipleRowSelection/jQuery/Light/

Also, if I select the parent row, whether the row is expanded or not has no affect, the children are never automatically selected. I would expect selecting the parent row should automatically select the children whether the parent is expanded or not. Further, I would expect the checkbox on the parent to be the same functionality or three state so that if I unselect a child it should change to indicate that like the SelectAll checkbox visual state.

Hi . How can i change globlizayion of my dxdatebox from gregorian to jalali ?
I know that i have to use globlization.js and cldr.js and dependencies but still when i am using dxdatebox it is not working and says your date.js is not supporting jullian calendar
Is there any when that i change my dxdatebox to julian?
Thanks for your attention

Reopening as it's a feature request as discussed in #2358

Hi Everyone
dxDropDownBox is different observer in chrome developer tool open and close.

TL:DR
Have you got dxDropdownbox with cascade at runtime.

Ex Code

   <%= OneHtml.DdGrid<CustomerRequestWrapper>(m=>m.InterviewId, wrapperDivClass:class12_12_12, ngEnabled:"SalesmanIdEnabled", ngId="sbInterview", htmlId="ddbInterview") %>

Above code creating belove code
=======
<div class="col-md-12 col-sm-12 col-xs-12">                                                    <label class="control-label bold">Görüşme</label>
   <div id="ddbInterview" dx-drop-down-box="sbInterview">
		<div data-options="dxTemplate: { name: 'content' }">
			<div id="gridInterview" dx-data-grid="sbInterview.dataGrid"></div>
        </div>
	</div>
</div>

and

<scirpt type="text/javascript">
  $scope.InterviewServiceLoad=()=>
        {
            InterviewService.LookupForRequest($scope.ActiveRow, $scope.CustomerRequestWrapper.OperationId, $scope.CustomerRequestWrapper.SalesmanId, $scope.GetCurrentCustomerId()).then((r) => {
                $scope.InterviewDataSourceList = r.Data;
                $scope.fgridstate = true;
            });
        }
      
        $("#ddbInterview").click(() => {
            console.log('mf');
            if ($("#ddbInterview").dxDropDownBox("instance").isReady()) {
                if (true) {
                    $("#ddbInterview").dxDropDownBox("instance").repaint();
                    $scope.fgridstate = false;
                }
            }
        });
        
        $scope.sbInterview = {
            bindingOptions: {
                dataSource: "InterviewDataSourceList",
                value: Config.ModelId + ".InterviewId"
            },
            valueExpr: "Id",
            displayExpr: "Id",
            showClearButton: true,
            onValueChanged: function (e) {
                e.component.close();
            },
            dataGrid: {
                bindingOptions: {
                    dataSource:"InterviewDataSourceList"
                },
                columns: [
                    { dataField: "Id", caption: "No" }, "Interviewed", "CustomerId"
                ],
                hoverStateEnabled: true,
                paging: { enabled: false, pageSize: 20 },
                filterRow: { visible: false },
                scrolling: { mode: "virtual" },
                selection: { mode: "single" },
                onSelectionChanged: function (selectedItems) {
                    $scope.CustomerRequestWrapper.InterviewId = selectedItems.selectedRowKeys[0];
                }
            }
        };

SS:

Chrome Developer tools open (normal run) =>
http://imgur.com/flraPbg

Chrome Developer tools close (error run) =>
http://imgur.com/BHn64vw

other metod trigger $scope.InterviewServiceLoad

Steps to Reproduce:

1. Setup DevExtreme with Webpack 1
2. Draw a simple chart like:

<div dx-chart="{
  dataSource: [
    { fruit: 'Oranges', total: 10 },
    { fruit: 'Apples', total: 15 },
    { fruit: 'Bananas', total: 9 }
  ],
  series: { argumentField: 'fruit', valueField: 'total' }
}"></div>

3. Use webpack plugin UglifyJsPlugin to uglify your javascript code

Results You Received:

Chart plugin draws only the background but not the actual chart

Results You Expected:

Beautiful chart is drawn

Environment Details:

DevExtreme 17.1
Angular 1.5.7
Webpack 1.12.11
Latest Chrome

Steps to Reproduce:

ASP.NET MVC Core 2.0 DevExtreme

1. Create class with array of elements like this:
   public class TestElement {
   public string Id { get; set; }
   }

   public class Test{
   public List SomeArray { get; set;}
   }

2. Add form with Test object - Html.DevExtreme().Form().FormData(TestObject)

3. Add SimpleItem with data field to array element -
   AddSimple().DataField($"SomeArray[0].Id").Visible(false);

4. Add to page Model the following handlers
   public void OnPost(Test request){ }
   public void OnGet() {
   TestObject = new Test() { SomeArray = new List() { new TestElement { Id = Guid.NewGuid().ToString() } } }
   }

5. Submit form

Results You Received:

Id in array element is null

Results You Expected:

Id in array element is specified guid

!!! If you change Visible to true everything works fine

Steps to Reproduce:

1. we have model state errors and we expected to show error in edit form of data grid in inline editing
2. errors post to view as BadRequest(ModelState)
3. we didn't use validationRule because dosen't care about modelstate

Results You Received:

errors post to view but not shown in edit form like validation of form widget.

Results You Expected:

we expected to see validation errors on edit form when datagrid in edit mode.

Environment Details:

Asp.net core
DevExtreme 17.1.6
Chrome

I am using:

Windows 10,
Visual Studio 2017 Enterprise - Version 15.2 (26430.16) Release

When I install DevExtreme.Web from Nuget to a new ASP.NET Core application, the package reference shows up fine without any errors, but nothing works - the namespaces are inaccessible. I then tried to create another ASP.NET Core web app, but this time targeting the full .NET framework and I got the same problem. Also, I did restart Visual Studio in both instances to no avail.

Am I missing something here or is there a bug?

Steps to Reproduce:

1. Check this codepen link: https://codepen.io/sdanyliv/pen/oGZJNY
2. Click on header filter icon over Product Name column

Results You Received:

headerFilter loads ALL data with all columns when using OData datasource

Results You Expected:

Correct OData query that uses distinct, selects only one field that interested for header filter, and uses paging.
Possibility to cache these values instead of querying OData service for each click.

Environment Details:

Version: 17.1.6

Steps to Reproduce:

1. npm install -g @angular/[email protected] to get webpack 3.11.0
2. ng new angular-tour-of-heroes
3. npm up --save
4. npm install devextreme devextreme-angular --save
5. ng eject to create the webpack.config.js
6. npm run build

I'm a web dev beginner, so I don't know how to use webpack directly, but it's relevant that webpack 3.11.0 isn't a preview release and the fact that angular/cli is a preview is (IMHO) meaningless.

Results You Received:

ERROR in ./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/devextreme/dist/css/dx.light.css
(Emitted value instead of an instance of Error) CssSyntaxError: C:\Test-Projekte\Angular6\angular-tour-of-heroes\node_modules\devextreme\dist\css\dx.light.css:3219:12: Can't resolve 'icons/dxicons.woff)%20format(%27woff%27),%20url(icons/dxicons.ttf)%20format(%27truetype%27' in 'C:\Test-Projekte\Angular6\angular-tour-of-heroes\node_modules\devextreme\dist\css'

  3217 | @font-face {
  3218 |   font-family: 'DXIcons';
> 3219 |   src: url(icons/dxicons.woff) format('woff'), url(icons/dxicons.ttf) format('truetype');
       |            ^
  3220 |   font-weight: normal;
  3221 |   font-style: normal;

Results You Expected:

A successful build

Environment Details:

DevExtreme: 17.2.5 (also tested with 18.1.1-pre-18037)
Webpack: 3.11.0
OS: Win 10 1709

Proposed fix

Just put the value of url() into quotation marks and webpack will be able to resolve the relative URL.

Steps to Reproduce:

Results You Received:

Results You Expected:

Environment Details:

Popup not on front side when using inside TabPanel content template. it was fine before. but broken after npm update couple of days ago

Steps to Reproduce:

1. Use Popup inside TabPanel content template

Results You Received:

Results You Expected:

Environment Details:

17.1.4, angular 4.3.0, chrome, win 10

Example at Plunker.

Steps to Reproduce:

1. Drag some column header to the groupPanel.
2. Update toolbar's items option using dxToolbar.option method (reproduces for the static dataSource also).
3. Try to drag some item in the groupPanel back to the grid's header.

Results You Received:

groupPanel items are not draggable any more.

Results You Expected:

groupPanel items could be drag'n'dropped back to the grid's header.

Environment Details:

DevExtreme 17.2.4, Google Chrome 63, Windows 10

Steps to Reproduce:

1. Create dxForm with dxDateBox, set dateSerializationFormat and provide initial value:

$("#Form").dxForm({
    "colCount": 1,
    "width": 300.0,
    "items": [{
        "itemType": "simple",
        "dataField": "Date",
        "editorOptions": {
            "width": 200.0,
            "displayFormat": "shortDate",
            "dateSerializationFormat": "yyyy-MM-dd"
        },
        "editorType": "dxDateBox",
        "label": {
            "text": "Дата отчёта"
        }
    }],
    "formData": {
        "Date": new Date(2017,9,12)
    }
});

2. Run at js console following code:

$('#Form').dxForm('instance').option('formData')

3. Then select another date in dxDateBox and run code again:

Results You Received:

At first run you get a js date object: {Date: Thu Oct 12 2017 00:00:00 GMT+0300 (Russia Standard Time)}
At second run you get formatted string: {Date: "2017-10-12"}

Results You Expected:

Each time we will should receive a formatted string.

Environment Details:

Devextreme 17.1.6
Chrome 61.0.3163.100

DevExtreme doesn't seem to be usable with require()nor Webpack. Is it something you plan to support in the future?

1. Vuejs
2. Angular 2+
3. React
4. Angularjs
5. Ember
6. Aurelia
7. Knockout
8. Backbone
9. Dojo
10. Svelte

and more. The list grows every day.
Do you have a plan to develop framework-independent web components instead of developing custom components for frames?

Someone who loves Devexpress will not have to love angular. So we can choose which frame to use. You are focused on the core project. It's just an idea. :) regards to.

I don't know if that is a bug issue or if is it by design behaviour

I use the Devextreme 17.2.5 and this issue concerns the dxTreeList widget with selection mode "multiple" and selection recursive true

if select a node with childs in onSelectionChanged event, the e.selectedRowsData returns only the data for the selected (parent) node and not all of the selected data (with child nodes)

this is an example of this behaviour:
https://jsfiddle.net/samoilis/LwkgdLhg/30/

Steps to Reproduce:

1. Open virtual scrolling demo (Demo/DataGrid/VirtualScrolling)
2. Open DOM inspector
3. Expand "table" with "dx-datagrid-table dx-datagrid-table-fixed dx-datagrid-table-content" class node
4. Scroll the data grid using mouse wheel
5. Watch as loads of extra "tbody" elements are added to the "table" node

Results You Received:

Results You Expected:

No more than 2 "tbody" elements

Environment Details:

Chrome 62
Latest stable DevExtreme ( 17.1?)

Hello, DevEx
I'm using the Scheduler in Angular2 app and I need instead of a popup editing form, redirect user to another route with my own editing form (not popup).
I did not find a way to cancel the popup appointment editing form.
How can I cancel popup form?

Using 17.2.4 TreeList and for options have selection: {mode: 'multiple', showCheckBoxesMode: 'always', recursive: true}'. When I select a parent node that has 3 children, it correctly selects those 3 children and the parent however when using callback onSelectionChanged: function(e)and looking ate.currentSelectedRowKeys` it only contains the row I actually clicked on which is the parent row's index. What about the indexes of the children? How do I know that they were also selected. And of course when I unselect parent, the same happens. I need to know all the children that are selected / unselected.

How can I do that?

// import it to change locale and load localization messages
import { locale, loadMessages } from 'devextreme/localization';

import 'devextreme-intl';

// Load localized messages (English included by default)
const messagesDe = require('devextreme/localization/messages/de.json');

loadMessages(messagesDe);

// Set locale according the browser language
locale(navigator.language);
// ------------------ navigator.language is in IE and EDGE de-DE. In Chrome 'de'

Steps to Reproduce:

1. use locale(navigator.language); in IE or Edge with german languagesettings. navigator.language is 'de-DE' and does not work
2. use locale('de') in IE or Edge. This works for me.

Results You Received:

localization works only for 'de' not for 'de-DE'

Results You Expected:

Should work for 'de-DE' and 'de'

Environment Details:

Devextreme 17.1.5
InternetExplorer and Edge

Steps to Reproduce:

The issue can be re-created with this CodePen: https://codepen.io/jaggedaz/pen/YEgvme

1. Configure the Scheduler so that the onAppointmentClick and onAppointmentDblClick event handlers set event.cancel to true.
2. Add several events to a single day so that the appointment collector drop-down is generated.
3. Click the "More" item to show the appointment collector drop-down.
4. Click or double click one of the appointments.

Results You Received:

Displayed the appointment detail pop-up.

Results You Expected:

Should do nothing, should not display the appointment detail pop-up.

Environment Details:

devextreme 17.2.3

I am experimenting with Rails and DevExtreme.

Rails, by default, is expecting name attributes of input elements to be like model[field] for example name="article[caption]". At the moment, dxForm items ignores name for an item if there is dataField specified, and if formData contains keys like "model[field]" - binding is broken.

Is it possible to force name of generated input element in dxForm?

Environment Details:

DevExtreme 17.1

You deep support quite some frameworks, but how about react? Anything on the roadmap?

This is how DevExtreme.AspNet.Data loads data in jQuery-free mode.

Minimal app to reproduce:

package.json

{
  "name": "bug",
  "scripts": {
    "watch": "webpack --watch index.js index.out.js",
    "serve": "hs -q0"
  },
  "dependencies": {
    "devextreme": "^17.2.5",
    "http-server": "^0.11.1",
    "jquery": "^3.3.1",
    "webpack": "^3.10.0"
  }
}

index.js

//import 'devextreme/integration/jquery';

const ajax = require("devextreme/core/utils/ajax");

ajax.sendRequest({
    url: "https://js.devexpress.com/Demos/Mvc/api/DataGridWebApi/Orders",
    dataType: "json",
    cache: false
})
.done(function(res) {
    // BUG: res is null
    // "Uncaught SyntaxError: Unexpected token :" is browser console
    debugger
})
.fail(function(error) {
    debugger
})

index.html

<script src=index.out.js></script>

npm i
npm run watch
npm run serve

Hi,
I'm starting using DevExtreme and I love it but I found a big performance issue.
I created a basic application with one route-state (main) and I put a dx-button in the main component.
The main component also display a binded variable.
That variable is a get property and putting a console.log() in it I noticed that it is call every time I move the mouse on the screen.
Removing any DevExtreme module resolve the problem.

Unfortunately I cant reproduce the case on Plunkr so I created a very small application that reproduce the case.
You can find it here.

Once downloaded you just need to perform this commands:

• npm install
• npm run

As every angular-cli application the server is binded to localhost:4200 by default.

Environment Details:

Mac OS 10.10
Node 6.11
angular-cli 1.2.1

Some time ago, I was working on a PR for T487901, but I want to test my changes locally before submitting a PR.

I've been following the description to build and test DevExtreme locally here: https://github.com/DevExpress/DevExtreme/blob/17_2/README_DEVELOPERS.md#locally-in-docker

But there's something I don't quite understand, since I get an error message that says ./docker-ci.sh doesn't exist at the provided path.

Any hints on what's wrong, or links to more resources that can help me run the CI tests before opening a PR?

We've used VueJS for building our new product for enterprises. We really want to see some support for VueJS. So that we could start to leverage this powerful UI libraries. Is here the right channel to ask for this?

Steps to Reproduce:

1. Create a repository with starter files
2. Install devexpress node_modules
3. Import any one module and add to imports array of AppModule
4. ng build response are as below

Alternatively, removed the module declaration and ran ng build it results in very few memory

Results You Received:

Results You Expected:

Environment Details: