Skip to content

Commit a83770f

Browse files
author
pipeline
committed
sample(EJ2-5423): Spinner related styles removed.
1 parent 7b69bfb commit a83770f

File tree

9 files changed

+5
-70
lines changed

9 files changed

+5
-70
lines changed
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
{"index.ts":"import { enableRipple } from '@syncfusion/ej2-base';\nenableRipple(true);\n/**\n * AutoComplete Remote-Data & Local-Data Samples\n */\nimport { AutoComplete } from '@syncfusion/ej2-dropdowns';\nimport { Query, DataManager, ODataV4Adaptor } from '@syncfusion/ej2-data';\nimport { CheckBox, ChangeEventArgs } from '@syncfusion/ej2-buttons';\n\n\n let countries: { [key: string]: Object; }[] = [\n { Name: 'Australia', Code: 'AU' },\n { Name: 'Bermuda', Code: 'BM' },\n { Name: 'Canada', Code: 'CA' },\n { Name: 'Cameroon', Code: 'CM' },\n { Name: 'Denmark', Code: 'DK' },\n { Name: 'France', Code: 'FR' },\n { Name: 'Finland', Code: 'FI' },\n { Name: 'Germany', Code: 'DE' },\n { Name: 'Greenland', Code: 'GL' },\n { Name: 'Hong Kong', Code: 'HK' },\n { Name: 'India', Code: 'IN' },\n { Name: 'Italy', Code: 'IT' },\n { Name: 'Japan', Code: 'JP' },\n { Name: 'Mexico', Code: 'MX' },\n { Name: 'Norway', Code: 'NO' },\n { Name: 'Poland', Code: 'PL' },\n { Name: 'Switzerland', Code: 'CH' },\n { Name: 'United Kingdom', Code: 'GB' },\n { Name: 'United States', Code: 'US' }\n ];\n let loader: HTMLElement;\n // initialize AutoComplete component\n let atcObj1: AutoComplete = new AutoComplete({\n // bind the DataManager instance to dataSource property\n dataSource: new DataManager({\n url: 'http://services.odata.org/V4/Northwind/Northwind.svc/Products',\n adaptor: new ODataV4Adaptor,\n crossDomain: true\n }),\n // set the count for displays the suggestion items.\n suggestionCount: 5,\n // bind the Query instance to query property\n query: new Query().select(['ProductID', 'ProductName']),\n // map the appropriate columns to fields property\n fields: { value: 'ProductName' },\n // set the placeholder to AutoComplete input element\n placeholder: 'e.g. Alice Mutton',\n // sort the resulted items\n sortOrder: 'Ascending',\n // enable the autofill property to fill a first matched value in input when press a down key\n autofill: true,\n // set the filterType to searching operation\n filterType: 'StartsWith'\n });\n atcObj1.appendTo('#products');\n\n // initialize AutoComplete component\n let atcObj2: AutoComplete = new AutoComplete({\n //set the local data to dataSource property\n dataSource: countries,\n // map the appropriate columns to fields property\n fields: { value: 'Name' },\n // set the placeholder to AutoComplete input element\n placeholder: 'e.g. Australia',\n // sort the resulted items\n sortOrder: 'Ascending',\n // set the filterType to searching operation\n filterType: 'StartsWith',\n // enable the autofill property to fill a first matched value in input when press a down key\n autofill: true\n });\n atcObj2.appendTo('#country');\n\n // initialize check box component\n let checkBoxObj: CheckBox = new CheckBox({\n // set true for enable the checked state at initial rendering\n checked: true,\n // set text value for check box element.\n label: 'Autofill',\n // bind change event\n change: (args: ChangeEventArgs) => {\n // enable or disable the autofill in remote data AutoComplete based on CheckBox checked state\n atcObj1.autofill = args.checked;\n // enable or disable the autofill in local data AutoComplete based on CheckBox checked state\n atcObj2.autofill = args.checked;\n }\n });\n checkBoxObj.appendTo('#checkAutofill');\n","index.html":"<!DOCTYPE html><html><head>\n <link href=\"http://npmci.syncfusion.com/production/demos/styles/material.css\" rel=\"stylesheet\">\n <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n <script src=\"https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.38/system.js\"></script>\n <script src=\"systemjs.config.js\"></script>\n</head>\n<body>\n<div class=\"control-section col-lg-9\">\n <div id=\"local-data\" class=\"col-lg-6\" style=\"padding-top:15px\">\n <div class=\"content\">\n <h4> Local Data</h4>\n <input type=\"text\" id=\"country\">\n </div>\n </div>\n <div id=\"remote-data\" class=\"col-lg-6\" style=\"padding-top:15px\">\n <div class=\"content\">\n <h4>Remote Data</h4>\n <input type=\"text\" id=\"products\">\n </div>\n </div>\n</div>\n<div class=\"col-lg-3 property-section\">\n <div id=\"property\" title=\"Properties\"> \n <div style=\"margin-left: 50px; padding-top:25px;\">\n <input id=\"checkAutofill\" type=\"checkbox\" checked=\"true\">\n </div>\n </div>\n</div>\n\n\n\n\n<style>\n .content {\n margin: 0 auto;\n width: 250px;\n }\n\n .e-input-group .e-input-group-icon.e-spinner-icon {\n background-image: url(./styles/images/Medium-36px-spin.gif) !important;\n background-size: 12px 12px !important;\n background-repeat: no-repeat !important;\n background-position: center center !important;\n top: -2px;\n }\n\n .e-input-group .e-spinner-icon.e-input-group-icon:active {\n background: transparent;\n }\n\n .e-input-group.e-ddl .e-input-group-icon.e-spinner-icon {\n border: none;\n }\n</style>\n\n</body></html>","systemjs.config.js":"System.config({\n transpiler: \"typescript\",\n typescriptOptions: {\n compilerOptions: {\n target: \"umd\",\n module: \"commonjs\",\n moduleResolution: \"node\",\n emitDecoratorMetadata: true,\n experimentalDecorators: true\n }\n },\n paths: {\n \"syncfusion:\": \"http://npmci.syncfusion.com/packages/production/\"\n },\n map: {\n main: \"index.ts\",\n typescript: \"https://unpkg.com/[email protected]/lib/typescript.js\",\n 'plugin-json':'https://cdnjs.cloudflare.com/ajax/libs/systemjs-plugin-json/0.3.0/json.min.js',\n \"@syncfusion/ej2-base\": \"syncfusion:ej2-base/dist/ej2-base.umd.min.js\",\n \"@syncfusion/ej2-buttons\": \"syncfusion:ej2-buttons/dist/ej2-buttons.umd.min.js\",\n \"@syncfusion/ej2-calendars\": \"syncfusion:ej2-calendars/dist/ej2-calendars.umd.min.js\",\n \"@syncfusion/ej2-charts\": \"syncfusion:ej2-charts/dist/ej2-charts.umd.min.js\",\n \"@syncfusion/ej2-circulargauge\": \"syncfusion:ej2-circulargauge/dist/ej2-circulargauge.umd.min.js\",\n \"@syncfusion/ej2-lineargauge\": \"syncfusion:ej2-lineargauge/dist/ej2-lineargauge.umd.min.js\",\n \"@syncfusion/ej2-data\": \"syncfusion:ej2-data/dist/ej2-data.umd.min.js\",\n \"@syncfusion/ej2-dropdowns\": \"syncfusion:ej2-dropdowns/dist/ej2-dropdowns.umd.min.js\",\n \"@syncfusion/ej2-grids\": \"syncfusion:ej2-grids/dist/ej2-grids.umd.min.js\", \n \"@syncfusion/ej2-inputs\": \"syncfusion:ej2-inputs/dist/ej2-inputs.umd.min.js\", \n \"@syncfusion/ej2-lists\": \"syncfusion:ej2-lists/dist/ej2-lists.umd.min.js\",\n \"@syncfusion/ej2-navigations\": \"syncfusion:ej2-navigations/dist/ej2-navigations.umd.min.js\", \n \"@syncfusion/ej2-popups\": \"syncfusion:ej2-popups/dist/ej2-popups.umd.min.js\",\n \"@syncfusion/ej2-excel-export\": \"syncfusion:ej2-excel-export/dist/ej2-excel-export.umd.min.js\",\n \"@syncfusion/ej2-pdf-export\": \"syncfusion:ej2-pdf-export/dist/ej2-pdf-export.umd.min.js\",\n \"@syncfusion/ej2-compression\": \"syncfusion:ej2-compression/dist/ej2-compression.umd.min.js\",\n \"@syncfusion/ej2-file-utils\": \"syncfusion:ej2-file-utils/dist/ej2-file-utils.umd.min.js\"\n },\n meta: { \n '*.json': { loader: 'plugin-json' }\n }\n});\nSystem.import('index.ts').catch(console.error.bind(console));"}
1+
{"index.ts":"import { enableRipple } from '@syncfusion/ej2-base';\nenableRipple(true);\n/**\n * AutoComplete Remote-Data & Local-Data Samples\n */\nimport { AutoComplete } from '@syncfusion/ej2-dropdowns';\nimport { Query, DataManager, ODataV4Adaptor } from '@syncfusion/ej2-data';\nimport { CheckBox, ChangeEventArgs } from '@syncfusion/ej2-buttons';\n\n\n let countries: { [key: string]: Object; }[] = [\n { Name: 'Australia', Code: 'AU' },\n { Name: 'Bermuda', Code: 'BM' },\n { Name: 'Canada', Code: 'CA' },\n { Name: 'Cameroon', Code: 'CM' },\n { Name: 'Denmark', Code: 'DK' },\n { Name: 'France', Code: 'FR' },\n { Name: 'Finland', Code: 'FI' },\n { Name: 'Germany', Code: 'DE' },\n { Name: 'Greenland', Code: 'GL' },\n { Name: 'Hong Kong', Code: 'HK' },\n { Name: 'India', Code: 'IN' },\n { Name: 'Italy', Code: 'IT' },\n { Name: 'Japan', Code: 'JP' },\n { Name: 'Mexico', Code: 'MX' },\n { Name: 'Norway', Code: 'NO' },\n { Name: 'Poland', Code: 'PL' },\n { Name: 'Switzerland', Code: 'CH' },\n { Name: 'United Kingdom', Code: 'GB' },\n { Name: 'United States', Code: 'US' }\n ];\n let loader: HTMLElement;\n // initialize AutoComplete component\n let atcObj1: AutoComplete = new AutoComplete({\n // bind the DataManager instance to dataSource property\n dataSource: new DataManager({\n url: 'http://services.odata.org/V4/Northwind/Northwind.svc/Products',\n adaptor: new ODataV4Adaptor,\n crossDomain: true\n }),\n // set the count for displays the suggestion items.\n suggestionCount: 5,\n // bind the Query instance to query property\n query: new Query().select(['ProductID', 'ProductName']),\n // map the appropriate columns to fields property\n fields: { value: 'ProductName' },\n // set the placeholder to AutoComplete input element\n placeholder: 'e.g. Alice Mutton',\n // sort the resulted items\n sortOrder: 'Ascending',\n // enable the autofill property to fill a first matched value in input when press a down key\n autofill: true,\n // set the filterType to searching operation\n filterType: 'StartsWith'\n });\n atcObj1.appendTo('#products');\n\n // initialize AutoComplete component\n let atcObj2: AutoComplete = new AutoComplete({\n //set the local data to dataSource property\n dataSource: countries,\n // map the appropriate columns to fields property\n fields: { value: 'Name' },\n // set the placeholder to AutoComplete input element\n placeholder: 'e.g. Australia',\n // sort the resulted items\n sortOrder: 'Ascending',\n // set the filterType to searching operation\n filterType: 'StartsWith',\n // enable the autofill property to fill a first matched value in input when press a down key\n autofill: true\n });\n atcObj2.appendTo('#country');\n\n // initialize check box component\n let checkBoxObj: CheckBox = new CheckBox({\n // set true for enable the checked state at initial rendering\n checked: true,\n // set text value for check box element.\n label: 'Autofill',\n // bind change event\n change: (args: ChangeEventArgs) => {\n // enable or disable the autofill in remote data AutoComplete based on CheckBox checked state\n atcObj1.autofill = args.checked;\n // enable or disable the autofill in local data AutoComplete based on CheckBox checked state\n atcObj2.autofill = args.checked;\n }\n });\n checkBoxObj.appendTo('#checkAutofill');\n","index.html":"<!DOCTYPE html><html><head>\n <link href=\"http://npmci.syncfusion.com/production/demos/styles/material.css\" rel=\"stylesheet\">\n <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n <script src=\"https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.38/system.js\"></script>\n <script src=\"systemjs.config.js\"></script>\n</head>\n<body>\n<div class=\"control-section col-lg-9\">\n <div id=\"local-data\" class=\"col-lg-6\" style=\"padding-top:15px\">\n <div class=\"content\">\n <h4> Local Data</h4>\n <input type=\"text\" id=\"country\">\n </div>\n </div>\n <div id=\"remote-data\" class=\"col-lg-6\" style=\"padding-top:15px\">\n <div class=\"content\">\n <h4>Remote Data</h4>\n <input type=\"text\" id=\"products\">\n </div>\n </div>\n</div>\n<div class=\"col-lg-3 property-section\">\n <div id=\"property\" title=\"Properties\"> \n <div style=\"margin-left: 50px; padding-top:25px;\">\n <input id=\"checkAutofill\" type=\"checkbox\" checked=\"true\">\n </div>\n </div>\n</div>\n\n\n\n\n<style>\n .content {\n margin: 0 auto;\n width: 250px;\n }\n</style>\n\n</body></html>","systemjs.config.js":"System.config({\n transpiler: \"typescript\",\n typescriptOptions: {\n compilerOptions: {\n target: \"umd\",\n module: \"commonjs\",\n moduleResolution: \"node\",\n emitDecoratorMetadata: true,\n experimentalDecorators: true\n }\n },\n paths: {\n \"syncfusion:\": \"http://npmci.syncfusion.com/packages/production/\"\n },\n map: {\n main: \"index.ts\",\n typescript: \"https://unpkg.com/[email protected]/lib/typescript.js\",\n 'plugin-json':'https://cdnjs.cloudflare.com/ajax/libs/systemjs-plugin-json/0.3.0/json.min.js',\n \"@syncfusion/ej2-base\": \"syncfusion:ej2-base/dist/ej2-base.umd.min.js\",\n \"@syncfusion/ej2-buttons\": \"syncfusion:ej2-buttons/dist/ej2-buttons.umd.min.js\",\n \"@syncfusion/ej2-calendars\": \"syncfusion:ej2-calendars/dist/ej2-calendars.umd.min.js\",\n \"@syncfusion/ej2-charts\": \"syncfusion:ej2-charts/dist/ej2-charts.umd.min.js\",\n \"@syncfusion/ej2-circulargauge\": \"syncfusion:ej2-circulargauge/dist/ej2-circulargauge.umd.min.js\",\n \"@syncfusion/ej2-lineargauge\": \"syncfusion:ej2-lineargauge/dist/ej2-lineargauge.umd.min.js\",\n \"@syncfusion/ej2-data\": \"syncfusion:ej2-data/dist/ej2-data.umd.min.js\",\n \"@syncfusion/ej2-dropdowns\": \"syncfusion:ej2-dropdowns/dist/ej2-dropdowns.umd.min.js\",\n \"@syncfusion/ej2-grids\": \"syncfusion:ej2-grids/dist/ej2-grids.umd.min.js\", \n \"@syncfusion/ej2-inputs\": \"syncfusion:ej2-inputs/dist/ej2-inputs.umd.min.js\", \n \"@syncfusion/ej2-lists\": \"syncfusion:ej2-lists/dist/ej2-lists.umd.min.js\",\n \"@syncfusion/ej2-navigations\": \"syncfusion:ej2-navigations/dist/ej2-navigations.umd.min.js\", \n \"@syncfusion/ej2-popups\": \"syncfusion:ej2-popups/dist/ej2-popups.umd.min.js\",\n \"@syncfusion/ej2-excel-export\": \"syncfusion:ej2-excel-export/dist/ej2-excel-export.umd.min.js\",\n \"@syncfusion/ej2-pdf-export\": \"syncfusion:ej2-pdf-export/dist/ej2-pdf-export.umd.min.js\",\n \"@syncfusion/ej2-compression\": \"syncfusion:ej2-compression/dist/ej2-compression.umd.min.js\",\n \"@syncfusion/ej2-file-utils\": \"syncfusion:ej2-file-utils/dist/ej2-file-utils.umd.min.js\"\n },\n meta: { \n '*.json': { loader: 'plugin-json' }\n }\n});\nSystem.import('index.ts').catch(console.error.bind(console));"}

src/autocomplete/databinding.html

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -58,20 +58,4 @@ <h4>Remote Data</h4>
5858
margin: 0 auto;
5959
width: 250px;
6060
}
61-
62-
.e-input-group .e-input-group-icon.e-spinner-icon {
63-
background-image: url(./styles/images/Medium-36px-spin.gif) !important;
64-
background-size: 12px 12px !important;
65-
background-repeat: no-repeat !important;
66-
background-position: center center !important;
67-
top: -2px;
68-
}
69-
70-
.e-input-group .e-spinner-icon.e-input-group-icon:active {
71-
background: transparent;
72-
}
73-
74-
.e-input-group.e-ddl .e-input-group-icon.e-spinner-icon {
75-
border: none;
76-
}
7761
</style>

0 commit comments

Comments
 (0)