Skip to content

Commit 75c2f5f

Browse files
Merge branch '25_1' into 25_1_ng_nested_fix
2 parents 792107d + 2348b35 commit 75c2f5f

File tree

44 files changed

+375
-233
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

44 files changed

+375
-233
lines changed

apps/demos/Demos/Autocomplete/Overview/Angular/app/app.component.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,13 +54,13 @@
5454
<div class="dx-field-value">
5555
<dx-autocomplete
5656
placeholder="Type state name..."
57-
valueExpr="State_Long"
57+
valueExpr="Name"
5858
[dataSource]="states"
5959
[(value)]="state"
6060
(onValueChanged)="updateEmployeeInfo()"
6161
>
6262
<div *dxTemplate="let item of 'item'">
63-
<span>{{ item.State_Long }} ({{ item.State_Short }})</span>
63+
<span>{{ item.Name }} ({{ item.Short }})</span>
6464
</div>
6565
</dx-autocomplete>
6666
</div>

apps/demos/Demos/Autocomplete/Overview/Angular/app/app.component.ts

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,10 @@ import { BrowserModule } from '@angular/platform-browser';
33
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
44
import { HttpClient, HttpClientModule, HttpParams } from '@angular/common/http';
55
import { lastValueFrom } from 'rxjs';
6-
import { DxAutocompleteModule, DxTemplateModule } from 'devextreme-angular';
7-
import { CustomStore, ODataStore } from 'devextreme-angular/common/data';
6+
import { DxAutocompleteModule } from 'devextreme-angular';
7+
import { CustomStore } from 'devextreme-angular/common/data';
88
import { Service } from './app.service';
9+
import * as AspNetData from 'devextreme-aspnet-data-nojquery';
910

1011
if (!/localhost/.test(document.location.host)) {
1112
enableProdMode();
@@ -35,7 +36,7 @@ export class AppComponent {
3536

3637
positions: string[];
3738

38-
states: ODataStore;
39+
states: CustomStore;
3940

4041
clientsStore: CustomStore;
4142

@@ -70,14 +71,12 @@ export class AppComponent {
7071
.then(({ data }: { data: Record<string, unknown>[] }) => ({
7172
data,
7273
}))
73-
.catch((error) => { throw 'Data Loading Error'; });
74+
.catch(() => { throw 'Data Loading Error'; });
7475
},
7576
});
76-
this.states = new ODataStore({
77-
version: 2,
78-
url: 'https://js.devexpress.com/Demos/DevAV/odata/States?$select=Sate_ID,State_Long,State_Short',
79-
key: 'Sate_ID',
80-
keyType: 'Int32',
77+
this.states = AspNetData.createStore({
78+
loadUrl: 'https://js.devexpress.com/Demos/NetCore/api/DataGridStatesLookup',
79+
key: 'ID',
8180
});
8281
this.names = service.getNames();
8382
this.surnames = service.getSurnames();
@@ -99,7 +98,6 @@ export class AppComponent {
9998
imports: [
10099
BrowserModule,
101100
DxAutocompleteModule,
102-
DxTemplateModule,
103101
HttpClientModule,
104102
],
105103
declarations: [AppComponent],

apps/demos/Demos/Autocomplete/Overview/React/App.tsx

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import React, { useCallback, useState } from 'react';
2-
import { ODataStore, CustomStore } from 'devextreme-react/common/data';
2+
import { CustomStore } from 'devextreme-react/common/data';
33
import { Autocomplete, type AutocompleteTypes } from 'devextreme-react/autocomplete';
44
import 'whatwg-fetch';
55
import { names, surnames, positions } from './data.ts';
6+
import AspNetData from 'devextreme-aspnet-data-nojquery';
67

78
function isNotEmpty(value: string) {
89
return value !== undefined && value !== null && value !== '';
@@ -11,11 +12,9 @@ function isNotEmpty(value: string) {
1112
const positionLabel = { 'aria-label': 'Position' };
1213
const position = positions[0];
1314

14-
const states = new ODataStore({
15-
version: 2,
16-
url: 'https://js.devexpress.com/Demos/DevAV/odata/States?$select=Sate_ID,State_Long,State_Short',
17-
key: 'Sate_ID',
18-
keyType: 'Int32',
15+
const states = AspNetData.createStore({
16+
loadUrl: 'https://js.devexpress.com/Demos/NetCore/api/DataGridStatesLookup',
17+
key: 'ID',
1918
});
2019

2120
const clientsStore = new CustomStore({
@@ -42,7 +41,7 @@ const clientsStore = new CustomStore({
4241

4342
const renderState = (data) => (
4443
<span>
45-
{data.State_Long} ({data.State_Short})
44+
{data.Name} ({data.Short})
4645
</span>
4746
);
4847

@@ -131,7 +130,7 @@ function App() {
131130
<Autocomplete
132131
dataSource={states}
133132
value={state}
134-
valueExpr="State_Long"
133+
valueExpr="Name"
135134
onValueChanged={handleStateChange}
136135
placeholder="Type state name..."
137136
itemRender={renderState}

apps/demos/Demos/Autocomplete/Overview/ReactJs/App.js

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
11
import React, { useCallback, useState } from 'react';
2-
import { ODataStore, CustomStore } from 'devextreme-react/common/data';
2+
import { CustomStore } from 'devextreme-react/common/data';
33
import { Autocomplete } from 'devextreme-react/autocomplete';
44
import 'whatwg-fetch';
5+
import AspNetData from 'devextreme-aspnet-data-nojquery';
56
import { names, surnames, positions } from './data.js';
67

78
function isNotEmpty(value) {
89
return value !== undefined && value !== null && value !== '';
910
}
1011
const positionLabel = { 'aria-label': 'Position' };
1112
const position = positions[0];
12-
const states = new ODataStore({
13-
version: 2,
14-
url: 'https://js.devexpress.com/Demos/DevAV/odata/States?$select=Sate_ID,State_Long,State_Short',
15-
key: 'Sate_ID',
16-
keyType: 'Int32',
13+
const states = AspNetData.createStore({
14+
loadUrl: 'https://js.devexpress.com/Demos/NetCore/api/DataGridStatesLookup',
15+
key: 'ID',
1716
});
1817
const clientsStore = new CustomStore({
1918
key: 'Value',
@@ -40,7 +39,7 @@ const clientsStore = new CustomStore({
4039
});
4140
const renderState = (data) => (
4241
<span>
43-
{data.State_Long} ({data.State_Short})
42+
{data.Name} ({data.Short})
4443
</span>
4544
);
4645
function App() {
@@ -121,7 +120,7 @@ function App() {
121120
<Autocomplete
122121
dataSource={states}
123122
value={state}
124-
valueExpr="State_Long"
123+
valueExpr="Name"
125124
onValueChanged={handleStateChange}
126125
placeholder="Type state name..."
127126
itemRender={renderState}

apps/demos/Demos/Autocomplete/Overview/Vue/App.vue

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -54,13 +54,13 @@
5454
<DxAutocomplete
5555
:data-source="states"
5656
v-model:value="state"
57-
value-expr="State_Long"
57+
value-expr="Name"
5858
placeholder="Type state name..."
5959
item-template="stateTemplate"
6060
@value-changed="updateEmployeeInfo"
6161
>
6262
<template #stateTemplate="{ data }">
63-
<span>{{ data.State_Long }} ({{ data.State_Short }})</span>
63+
<span>{{ data.Name }} ({{ data.Short }})</span>
6464
</template>
6565
</DxAutocomplete>
6666
</div>
@@ -96,18 +96,15 @@
9696
</template>
9797
<script setup lang="ts">
9898
import { ref } from 'vue';
99-
import { ODataStore, CustomStore, type LoadOptions } from 'devextreme-vue/common/data';
99+
import { CustomStore, type LoadOptions } from 'devextreme-vue/common/data';
100100
import { DxAutocomplete } from 'devextreme-vue/autocomplete';
101101
import 'whatwg-fetch';
102+
import { createStore } from 'devextreme-aspnet-data-nojquery';
102103
import { names, surnames, positions } from './data.ts';
103104
104-
105-
const statesStore = new ODataStore({
106-
version: 2,
107-
url:
108-
'https://js.devexpress.com/Demos/DevAV/odata/States?$select=Sate_ID,State_Long,State_Short',
109-
key: 'Sate_ID',
110-
keyType: 'Int32',
105+
const statesStore = createStore({
106+
loadUrl: 'https://js.devexpress.com/Demos/NetCore/api/DataGridStatesLookup',
107+
key: 'ID',
111108
});
112109
113110
const clientsCustomStore = new CustomStore({

apps/demos/Demos/Autocomplete/Overview/jQuery/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
<script src="../../../../node_modules/jquery/dist/jquery.min.js"></script>
99
<link rel="stylesheet" type="text/css" href="../../../../node_modules/devextreme-dist/css/dx.light.css" />
1010
<script src="../../../../node_modules/devextreme-dist/js/dx.all.js"></script>
11+
<script src="../../../../node_modules/devextreme-aspnet-data/js/dx.aspnet.data.js"></script>
1112
<script src="data.js"></script>
1213
<link rel="stylesheet" type="text/css" href="styles.css" />
1314
<script src="index.js"></script>

apps/demos/Demos/Autocomplete/Overview/jQuery/index.js

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -32,16 +32,14 @@ $(() => {
3232
});
3333

3434
$('#state').dxAutocomplete({
35-
dataSource: new DevExpress.data.ODataStore({
36-
version: 2,
37-
url: 'https://js.devexpress.com/Demos/DevAV/odata/States?$select=Sate_ID,State_Long,State_Short',
38-
key: 'Sate_ID',
39-
keyType: 'Int32',
35+
dataSource: DevExpress.data.AspNet.createStore({
36+
loadUrl: 'https://js.devexpress.com/Demos/NetCore/api/DataGridStatesLookup',
37+
key: 'ID',
4038
}),
4139
placeholder: 'Type state name...',
42-
valueExpr: 'State_Long',
40+
valueExpr: 'Name',
4341
itemTemplate(data) {
44-
return $(`<div>${data.State_Long} (${data.State_Short})</div>`);
42+
return $(`<div>${data.Name} (${data.Short})</div>`);
4543
},
4644
onValueChanged(data) {
4745
state = data.value;

apps/demos/Demos/Charts/LoadDataOnDemand/Angular/app/app.component.ts

Lines changed: 15 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -77,51 +77,46 @@ export class AppComponent {
7777

7878
uploadDataByVisualRange() {
7979
const dataSource = this.component.instance.getDataSource();
80-
const storage = dataSource.items();
81-
const bounded = !!storage.length;
8280
const ajaxArgs = {
8381
startVisible: this.getDateString(this._visualRange.startValue as Date),
8482
endVisible: this.getDateString(this._visualRange.endValue as Date),
85-
startBound: this.getDateString(bounded ? storage[0].date : null),
86-
endBound: this.getDateString(bounded ? storage[storage.length - 1].date : null),
8783
};
8884

89-
if (ajaxArgs.startVisible !== ajaxArgs.startBound
90-
&& ajaxArgs.endVisible !== ajaxArgs.endBound && !this.packetsLock) {
91-
this.packetsLock++;
85+
if (!this.packetsLock) {
86+
this.packetsLock += 1;
9287
this.component.instance.showLoadingIndicator();
9388

9489
this.getDataFrame(ajaxArgs)
9590
.then((dataFrame: Record<string, number | Date>[]) => {
96-
this.packetsLock--;
97-
dataFrame = dataFrame.map((i) => ({
98-
date: new Date(i.Date),
99-
minTemp: i.MinTemp,
100-
maxTemp: i.MaxTemp,
101-
}));
91+
this.packetsLock -= 1;
10292

10393
const componentStorage = dataSource.store();
10494

105-
dataFrame.forEach((item) => componentStorage.insert(item));
95+
dataFrame
96+
.map((i) => ({
97+
date: new Date(i.Date),
98+
minTemp: i.MinTemp,
99+
maxTemp: i.MaxTemp,
100+
}))
101+
.forEach((item) => componentStorage.insert(item));
102+
106103
dataSource.reload();
107104

108105
this.onVisualRangeChanged();
109106
})
110-
.catch((error) => {
111-
this.packetsLock--;
107+
.catch(() => {
108+
this.packetsLock -= 1;
112109
dataSource.reload();
113110
});
114111
}
115112
}
116113

117114
getDataFrame(args: Record<string, string>) {
118115
const params = `startVisible=${args.startVisible}`
119-
+ `&endVisible=${args.endVisible}`
120-
+ `&startBound=${args.startBound}`
121-
+ `&endBound=${args.endBound}`;
116+
+ `&endVisible=${args.endVisible}`;
122117

123118
return lastValueFrom(
124-
this.httpClient.get(`https://js.devexpress.com/Demos/WidgetsGallery/data/temperatureData?${params}`),
119+
this.httpClient.get(`https://js.devexpress.com/Demos/NetCore/api/TemperatureData?${params}`),
125120
);
126121
}
127122

apps/demos/Demos/Charts/LoadDataOnDemand/React/App.tsx

Lines changed: 3 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -89,21 +89,12 @@ function App() {
8989

9090
const uploadDataByVisualRange = (visualRange, component) => {
9191
const dataSource = component.getDataSource();
92-
const storage = dataSource.items();
9392
const ajaxArgs = {
9493
startVisible: getDateString(visualRange.startValue),
9594
endVisible: getDateString(visualRange.endValue),
96-
startBound: getDateString(storage.length ? storage[0].date : null),
97-
endBound: getDateString(
98-
storage.length ? storage[storage.length - 1].date : null,
99-
),
10095
};
10196

102-
if (
103-
ajaxArgs.startVisible !== ajaxArgs.startBound
104-
&& ajaxArgs.endVisible !== ajaxArgs.endBound
105-
&& !packetsLock
106-
) {
97+
if (!packetsLock) {
10798
packetsLock += 1;
10899
component.showLoadingIndicator();
109100

@@ -147,12 +138,10 @@ function getDataFrame(args) {
147138
let params = '?';
148139

149140
params += `startVisible=${args.startVisible}
150-
&endVisible=${args.endVisible}
151-
&startBound=${args.startBound}
152-
&endBound=${args.endBound}`;
141+
&endVisible=${args.endVisible}`;
153142

154143
return fetch(
155-
`https://js.devexpress.com/Demos/WidgetsGallery/data/temperatureData${params}`,
144+
`https://js.devexpress.com/Demos/NetCore/api/TemperatureData${params}`,
156145
).then((response) => response.json());
157146
}
158147

apps/demos/Demos/Charts/LoadDataOnDemand/ReactJs/App.js

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -85,18 +85,11 @@ function App() {
8585
}
8686
const uploadDataByVisualRange = (visualRange, component) => {
8787
const dataSource = component.getDataSource();
88-
const storage = dataSource.items();
8988
const ajaxArgs = {
9089
startVisible: getDateString(visualRange.startValue),
9190
endVisible: getDateString(visualRange.endValue),
92-
startBound: getDateString(storage.length ? storage[0].date : null),
93-
endBound: getDateString(storage.length ? storage[storage.length - 1].date : null),
9491
};
95-
if (
96-
ajaxArgs.startVisible !== ajaxArgs.startBound
97-
&& ajaxArgs.endVisible !== ajaxArgs.endBound
98-
&& !packetsLock
99-
) {
92+
if (!packetsLock) {
10093
packetsLock += 1;
10194
component.showLoadingIndicator();
10295
getDataFrame(ajaxArgs)
@@ -132,10 +125,8 @@ const onVisualRangeChanged = (visualRange, component) => {
132125
function getDataFrame(args) {
133126
let params = '?';
134127
params += `startVisible=${args.startVisible}
135-
&endVisible=${args.endVisible}
136-
&startBound=${args.startBound}
137-
&endBound=${args.endBound}`;
138-
return fetch(`https://js.devexpress.com/Demos/WidgetsGallery/data/temperatureData${params}`).then(
128+
&endVisible=${args.endVisible}`;
129+
return fetch(`https://js.devexpress.com/Demos/NetCore/api/TemperatureData${params}`).then(
139130
(response) => response.json(),
140131
);
141132
}

0 commit comments

Comments
 (0)