Skip to content

Commit ae4d291

Browse files
SyncfusionBuildSyncfusionBuild
committed
Integrated latest changes at 06-14-2024 1:42:41 PM
1 parent 5ce5597 commit ae4d291

File tree

439 files changed

+14981
-1160
lines changed

Some content is hidden

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

439 files changed

+14981
-1160
lines changed

‎ej2-angular-toc.html

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -241,6 +241,7 @@
241241
<li><a href="/ej2-angular/auto-complete/templates">Templates</a></li>
242242
<li><a href="/ej2-angular/auto-complete/virtual-scroll">Virtualization</a></li>
243243
<li><a href="/ej2-angular/auto-complete/grouping">Grouping</a></li>
244+
<li><a href="/ej2-angular/auto-complete/disabled-items">Disabled Items</a></li>
244245
<li><a href="/ej2-angular/auto-complete/filtering">Filtering</a></li>
245246
<li><a href="/ej2-angular/auto-complete/localization">Localization</a></li>
246247
<li><a href="/ej2-angular/auto-complete/style">Style and appearance</a></li>
@@ -611,6 +612,7 @@
611612
<li><a href="/ej2-angular/combo-box/templates">Templates</a></li>
612613
<li><a href="/ej2-angular/combo-box/virtual-scroll">Virtualization</a></li>
613614
<li><a href="/ej2-angular/combo-box/grouping">Grouping</a></li>
615+
<li><a href="/ej2-angular/combo-box/disabled-items">Disabled Items</a></li>
614616
<li><a href="/ej2-angular/combo-box/filtering">Filtering</a></li>
615617
<li><a href="/ej2-angular/combo-box/localization">Localization</a></li>
616618
<li><a href="/ej2-angular/combo-box/style">Style and appearance</a></li>
@@ -1005,6 +1007,7 @@
10051007
<li><a href="/ej2-angular/drop-down-list/templates">Templates</a></li>
10061008
<li><a href="/ej2-angular/drop-down-list/virtual-scroll">Virtualization</a></li>
10071009
<li><a href="/ej2-angular/drop-down-list/grouping">Grouping</a></li>
1010+
<li><a href="/ej2-angular/drop-down-list/disabled-items">Disabled Items</a></li>
10081011
<li><a href="/ej2-angular/drop-down-list/filtering">Filtering</a></li>
10091012
<li><a href="/ej2-angular/drop-down-list/localization">Localization</a></li>
10101013
<li><a href="/ej2-angular/drop-down-list/style">Style and appearance</a></li>
@@ -1667,6 +1670,18 @@
16671670
MultiColumn ComboBox
16681671
<ul>
16691672
<li><a href="/ej2-angular/multicolumn-combobox/getting-started">Getting Started</a></li>
1673+
<li><a href="/ej2-angular/multicolumn-combobox/data-binding">Data Binding</a></li>
1674+
<li><a href="/ej2-angular/multicolumn-combobox/items">Items</a></li>
1675+
<li><a href="/ej2-angular/multicolumn-combobox/columns">Columns</a></li>
1676+
<li><a href="/ej2-angular/multicolumn-combobox/grouping">Grouping</a></li>
1677+
<li><a href="/ej2-angular/multicolumn-combobox/sorting">Sorting</a></li>
1678+
<li><a href="/ej2-angular/multicolumn-combobox/filtering">Filtering</a></li>
1679+
<li><a href="/ej2-angular/multicolumn-combobox/virtualization">Virtualization</a></li>
1680+
<li><a href="/ej2-angular/multicolumn-combobox/templates">Templates</a></li>
1681+
<li><a href="/ej2-angular/multicolumn-combobox/localization">Localization</a></li>
1682+
<li><a href="/ej2-angular/multicolumn-combobox/accessibility">Accessibility</a></li>
1683+
<li><a href="/ej2-angular/multicolumn-combobox/events">Events</a></li>
1684+
<li><a href="https://ej2.syncfusion.com/angular/documentation/api/multicolumn-combobox">API Reference</a></li>
16701685
</ul>
16711686
</li><li>
16721687
MultiSelect
@@ -1676,6 +1691,7 @@
16761691
<li><a href="/ej2-angular/multi-select/value-binding">Value Binding</a></li>
16771692
<li><a href="/ej2-angular/multi-select/templates">Templates</a></li>
16781693
<li><a href="/ej2-angular/multi-select/grouping">Grouping</a></li>
1694+
<li><a href="/ej2-angular/multi-select/disabled-items">Disabled Items</a></li>
16791695
<li><a href="/ej2-angular/multi-select/filtering">Filtering</a></li>
16801696
<li><a href="/ej2-angular/multi-select/custom-value">Custom Value</a></li>
16811697
<li><a href="/ej2-angular/multi-select/virtual-scroll">Virtualization</a></li>
@@ -1801,7 +1817,6 @@
18011817
<li><a href="/ej2-angular/pdfviewer/accessibility">Accessibility</a></li>
18021818
<li>How To
18031819
<ul>
1804-
<li><a href="/ej2-angular/pdfviewer/how-to/toolbar-customization">Toolbar Customization</a></li>
18051820
<li><a href="/ej2-angular/pdfviewer/how-to/unload-document">Unload the PDF document Programmatically</a></li>
18061821
<li><a href="/ej2-angular/pdfviewer/how-to/load-document">Load PDF documents dynamically</a></li>
18071822
<li><a href="/ej2-angular/pdfviewer/how-to/include-authorization-token">Include Authorization Token</a></li>
@@ -1821,7 +1836,6 @@
18211836
<li><a href="/ej2-angular/pdfviewer/how-to/load-n-number-page">Load N number of pages on initial loading</a></li>
18221837
<li><a href="/ej2-angular/pdfviewer/how-to/retry-timeout">Retry Timeout</a></li>
18231838
<li><a href="/ej2-angular/pdfviewer/how-to/redis-cache">Configure Redis Cache</a></li>
1824-
<li><a href="/ej2-angular/pdfviewer/how-to/toolbar-icon-customization">Customize toolbar</a></li>
18251839
<li><a href="/ej2-angular/pdfviewer/how-to/conformance">Supported conformance documents</a></li>
18261840
<li><a href="/ej2-angular/pdfviewer/how-to/custom-context-menu">Customize context menu</a></li>
18271841
<li><a href="/ej2-angular/pdfviewer/how-to/pagerenderstarted-pagerendercompleted">PageRenderInitiate and PageRenderComplete event</a></li>

‎ej2-angular/auto-complete/disabled-items.md

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
---
2+
layout: post
3+
title: Disabled Items in Angular AutoComplete component | Syncfusion
4+
description: Learn here all about Disabled Items in Syncfusion Angular AutoComplete component of Syncfusion Essential JS 2 and more.
5+
platform: ej2-angular
6+
control: Disabled Items
7+
documentation: ug
8+
domainurl: ##DomainURL##
9+
---
10+
11+
# Disabled Items in Angular AutoComplete component
12+
13+
The AutoComplete provides options for individual items to be either in an enabled or disabled state for specific scenarios. The category of each list item can be mapped through the [disabled](https://ej2.syncfusion.com/angular/documentation/api/auto-complete/#fields) field in the data table. Once an item is disabled, it cannot be selected as a value for the component. To configure the disabled item columns, use the `fields.disabled` property.
14+
15+
In the following sample, State are grouped according on its category using `disabled` field.
16+
17+
{% tabs %}
18+
{% highlight ts tabtitle="app.component.ts" %}
19+
{% include code-snippet/autocomplete/getting-started-cs18/src/app.component.ts %}
20+
{% endhighlight %}
21+
22+
{% highlight ts tabtitle="main.ts" %}
23+
{% include code-snippet/autocomplete/getting-started-cs18/src/main.ts %}
24+
{% endhighlight %}
25+
{% endtabs %}
26+
27+
{% previewsample "page.domainurl/samples/autocomplete/getting-started-cs18" %}
28+
29+
## Disable Item Method
30+
31+
The [disableItem](https://ej2.syncfusion.com/angular/documentation/api/auto-complete/#disableItem) method can be used to handle dynamic changing in disable state of a specific item. Only one item can be disabled in this method. To disable multiple items, this method can be iterated with the items list or array. The disabled field state will to be updated in the [dataSource](https://ej2.syncfusion.com/angular/documentation/api/auto-complete/#datasource), when the item is disabled using this method. If the selected item is disabled dynamically, then the selection will be cleared.
32+
33+
| Parameter | Type | Description |
34+
|------|------|------|
35+
| itemHTMLLIElement | <code>HTMLLIElement</code> | It accepts the HTML Li element of the item to be removed. |
36+
| itemValue | <code>string</code> \| <code>number</code> \| <code>boolean</code> \| <code>object</code> | It accepts the string, number, boolean and object type value of the item to be removed. |
37+
| itemIndex | <code>number</code> | It accepts the index of the item to be removed. |
38+
39+
## Enabled
40+
41+
If you want to disabled the overall component to set the [enabled](https://ej2.syncfusion.com/angular/documentation/api/auto-complete/#enabled) property to false.
42+
43+
{% [Disabled AutoComplete Component](././images/autocomplete-disable.png)" %}

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/angular.json

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"version": 1,
4+
"newProjectRoot": "projects",
5+
"projects": {
6+
"syncfusion-component": {
7+
"projectType": "application",
8+
"schematics": {},
9+
"root": "",
10+
"sourceRoot": "src",
11+
"prefix": "app",
12+
"architect": {
13+
"build": {
14+
"builder": "@angular-devkit/build-angular:browser",
15+
"options": {
16+
"outputPath": "dist",
17+
"index": "index.html",
18+
"main": "src/main.ts",
19+
"tsConfig": "tsconfig.json",
20+
"styles": [
21+
"src/styles.css"
22+
],
23+
"assets": [
24+
{
25+
"glob": "*.css",
26+
"input": "",
27+
"output": ""
28+
}
29+
]
30+
},
31+
"configurations": {
32+
"production": {
33+
"budgets": [
34+
{
35+
"type": "initial",
36+
"maximumWarning": "500kb",
37+
"maximumError": "10mb"
38+
},
39+
{
40+
"type": "anyComponentStyle",
41+
"maximumWarning": "2kb",
42+
"maximumError": "4kb"
43+
}
44+
],
45+
"outputHashing": "all"
46+
},
47+
"development": {
48+
"buildOptimizer": false,
49+
"optimization": false,
50+
"vendorChunk": true,
51+
"extractLicenses": false,
52+
"sourceMap": true,
53+
"namedChunks": true
54+
}
55+
},
56+
"defaultConfiguration": "production"
57+
},
58+
"serve": {
59+
"builder": "@angular-devkit/build-angular:dev-server",
60+
"configurations": {
61+
"production": {
62+
"buildTarget": "syncfusion-component:build:production"
63+
},
64+
"development": {
65+
"buildTarget": "syncfusion-component:build:development"
66+
}
67+
},
68+
"defaultConfiguration": "development"
69+
}
70+
}
71+
}
72+
},
73+
"cli": {
74+
"analytics": false
75+
}
76+
}

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/index.css

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
#container {
2+
visibility: hidden;
3+
}
4+
5+
#loader {
6+
color: #008cff;
7+
height: 40px;
8+
width: 30%;
9+
position: absolute;
10+
top: 45%;
11+
left: 45%;
12+
}
13+
14+
#wrapper {
15+
width: 250px;
16+
margin: 0 auto;
17+
}

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/index.html

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Angular AutoComplete</title>
5+
<meta charset="utf-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<meta name="description" content="Typescript Toolbar Controls" />
8+
9+
<meta name="author" content="Syncfusion" />
10+
<link href="index.css" rel="stylesheet" />
11+
<!-- Here we have used CDN links for our preview purpose -->
12+
</head>
13+
<body>
14+
<div id="wrapper" style='margin-top: 20px'>
15+
<app-root>
16+
<div id='loader'>LOADING....</div>
17+
</app-root>
18+
</div>
19+
</body>
20+
</html>

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/package.json

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
{
2+
"name": "syncfusion-component",
3+
"version": "0.0.0",
4+
"scripts": {
5+
"ng": "ng",
6+
"start": "ng serve",
7+
"build": "ng build",
8+
"watch": "ng build --watch --configuration development",
9+
"test": "ng test"
10+
},
11+
"private": true,
12+
"dependencies": {
13+
"@angular/core": "17.1.2",
14+
"@angular/forms": "17.1.2",
15+
"@angular/platform-browser": "17.1.2",
16+
"@angular/platform-browser-dynamic": "17.1.2",
17+
"@syncfusion/ej2-angular-buttons": "*",
18+
"@syncfusion/ej2-angular-dropdowns": "*",
19+
"@syncfusion/ej2-base": "*",
20+
"@syncfusion/ej2-buttons": "*",
21+
"@syncfusion/ej2-dropdowns": "*",
22+
"@syncfusion/ej2-inputs": "*",
23+
"@syncfusion/ej2-popups": "*",
24+
"@syncfusion/ej2-lists": "*",
25+
"@syncfusion/ej2-angular-base": "*",
26+
"@syncfusion/ej2-angular-popups": "*",
27+
"@angular/animations": "17.1.2",
28+
"@angular/common": "17.1.2",
29+
"@angular/compiler": "17.1.2",
30+
"@angular/router": "17.1.2",
31+
"moment": "2.29.4",
32+
"rxjs": "7.8.0",
33+
"tslib": "2.3.0",
34+
"zone.js": "0.14.3"
35+
},
36+
"devDependencies": {
37+
"@angular-devkit/build-angular": "17.1.2",
38+
"@angular/cli": "17.1.2",
39+
"@angular/compiler-cli": "17.1.2",
40+
"@types/jasmine": "4.3.0",
41+
"jasmine-core": "4.5.0",
42+
"karma": "6.4.0",
43+
"karma-chrome-launcher": "3.1.0",
44+
"karma-coverage": "2.2.0",
45+
"karma-jasmine": "5.1.0",
46+
"karma-jasmine-html-reporter": "2.0.0",
47+
"typescript": "5.3.3"
48+
}
49+
}

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/src/app.component.ts

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import { NgModule } from '@angular/core'
2+
import { BrowserModule } from '@angular/platform-browser'
3+
import { FormsModule, ReactiveFormsModule } from '@angular/forms'
4+
import { AutoCompleteModule } from '@syncfusion/ej2-angular-dropdowns'
5+
import { ButtonModule } from '@syncfusion/ej2-angular-buttons'
6+
7+
8+
9+
10+
import { Component, HostListener, ViewChild } from '@angular/core';
11+
import { AutoCompleteComponent } from '@syncfusion/ej2-angular-dropdowns';
12+
@Component({
13+
imports: [
14+
FormsModule, ReactiveFormsModule, AutoCompleteModule, ButtonModule
15+
],
16+
17+
18+
standalone: true,
19+
selector: 'app-root',
20+
// specifies the template string for the AutoComplete component
21+
template: `<ejs-autocomplete id='atcelement' #samples [dataSource]='statusData' [fields]='fields' [placeholder]='text'></ejs-autocomplete>`
22+
})
23+
export class AppComponent {
24+
@ViewChild('samples')
25+
public status?: AutoCompleteComponent;
26+
constructor() {
27+
}
28+
public statusData: { [key: string]: Object }[] = [
29+
{ "Status": "Open", "State": false },
30+
{ "Status": "Waiting for Customer", "State": false },
31+
{ "Status": "On Hold", "State": true },
32+
{ "Status": "Follow-up", "State": false },
33+
{ "Status": "Closed", "State": true },
34+
{ "Status": "Solved", "State": false },
35+
{ "Status": "Feature Request", "State": false }
36+
];
37+
// maps the appropriate column to fields property
38+
public fields: Object = { value: 'Status', disabled: 'State' };
39+
//set the placeholder to AutoComplete input
40+
public text: string = "Select Status";
41+
@HostListener('document:keyup', ['$event'])
42+
handleKeyboardEvent(event: KeyboardEvent) {
43+
if (event.altKey && event.keyCode === 84 /* t */) {
44+
// press alt+t to focus the control.
45+
this.status!.focusIn();
46+
}
47+
}
48+
}
49+
50+
51+

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/src/main.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { AppComponent } from './app.component';
3+
import 'zone.js';
4+
bootstrapApplication(AppComponent).catch((err) => console.error(err));

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/src/styles.css

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
2+
@import 'node_modules/@syncfusion/ej2-base/styles/material.css';
3+
@import 'node_modules/@syncfusion/ej2-buttons/styles/material.css';
4+
@import 'node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
5+
@import 'node_modules/@syncfusion/ej2-inputs/styles/material.css';
6+
@import 'node_modules/@syncfusion/ej2-popups/styles/material.css';
7+
@import 'node_modules/@syncfusion/ej2-lists/styles/material.css';
8+
@import 'node_modules/@syncfusion/ej2-angular-base/styles/material.css';
9+
@import 'node_modules/@syncfusion/ej2-angular-popups/styles/material.css';
10+
@import 'node_modules/@syncfusion/ej2-angular-buttons/styles/material.css';
11+
@import 'node_modules/@syncfusion/ej2-angular-dropdowns/styles/material.css';

‎ej2-angular/code-snippet/autocomplete/getting-started-cs18/tsconfig.json

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"compileOnSave": false,
3+
"compilerOptions": {
4+
"baseUrl": "./",
5+
"outDir": "./dist/out-tsc",
6+
"forceConsistentCasingInFileNames": true,
7+
"strict": true,
8+
"noImplicitOverride": true,
9+
"noPropertyAccessFromIndexSignature": true,
10+
"noImplicitReturns": true,
11+
"noFallthroughCasesInSwitch": true,
12+
"sourceMap": true,
13+
"declaration": false,
14+
"downlevelIteration": true,
15+
"experimentalDecorators": true,
16+
"moduleResolution": "node",
17+
"importHelpers": true,
18+
"target": "ES2022",
19+
"module": "ES2022",
20+
"useDefineForClassFields": false,
21+
"lib": [
22+
"ES2022",
23+
"dom"
24+
]
25+
},
26+
"angularCompilerOptions": {
27+
"enableI18nLegacyMessageIdFormat": false,
28+
"strictInjectionParameters": true,
29+
"strictInputAccessModifiers": true,
30+
"strictTemplates": true
31+
}
32+
}

0 commit comments

Comments
 (0)