-
Notifications
You must be signed in to change notification settings - Fork 135
/
index.htm
220 lines (217 loc) · 12.3 KB
/
index.htm
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
<!DOCTYPE html>
<html lang="en">
<head>
<title id='Description'>jQWidgets User Interface for Angular, Vue.js, React, Web Components, ASP .NET, jQuery & Javascript</title>
<meta name="description" content="The leading HTML5 UI Components Framework. Build responsive HTML5 and JavaScript Apps with jQuery, Angular 8, Vue.js, React. Run on any platform, device, or browser" />
<link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" />
<style>
body {
font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
color: #333;
}
</style>
</head>
<body>
<h1>jQWidgets Installation through NPM:</h1>
<div>
The jQWidgets framework is available as NPM package:<br/>
jQuery, Javascript, Angular, Vue, React, Web Components:<br/>
<br/>
<ul>
<li><a href="https://www.npmjs.com/package/jqwidgets-scripts" target="_blank">https://www.npmjs.com/package/jqwidgets-scripts</a> - source files.</li>
<li><a href="https://www.npmjs.com/package/jqwidgets-framework" target="_blank">https://www.npmjs.com/package/jqwidgets-framework</a> - source files, demos, docs, images.</li>
<li><a href="https://www.npmjs.com/package/jqwidgets-ng" target="_blank">https://www.npmjs.com/package/jqwidgets-ng</a> - jQWidgets UI for Angular.</li>
<li><a href="https://www.npmjs.com/package/smart-webcomponents-angular" target="_blank">https://www.npmjs.com/package/smart-webcomponents-angular</a> - Smart UI for Angular.</li>
<li><a href="https://www.npmjs.com/package/smart-webcomponents" target="_blank">https://www.npmjs.com/package/smart-webcomponents</a> - Smart UI for Web Components.</li>
</ul>
</div>
<h2>License & Purchase</h2>
<p>e-mail: <a href="mailto: sales@jqwidgets.com">sales@jqwidgets.com</a></p><p>Phone: +359 88-2223800</p>
<p>Get a license: <a target="_blank" href="https://www.jqwidgets.com/">https://www.jqwidgets.com/license</a></p>
<h2>1. The SDK files are located in the jqwidgets directory</h2>
<br/>
In general you need to use files from this directory only.
<br/>
<h3>Files list & description:</h3>
Files required in all projects using the SDK:
<br/><br/>
jqxcore.js: Core jQWidgets framework
<br/><br/>
Stylesheet files. Include at least one stylesheet Theme file and the images folder:
<br/><br/>
<ul>
<li>styles/jqx.base.css: Stylesheet for the base Theme. The jqx.base.css file should be always included in your project. </li>
<li>styles/jqx.material.css: Stylesheet for the Material Theme</li>
<li>styles/jqx.material-purple.css: Stylesheet for the Material Purple Theme</li>
<li>styles/jqx.material-green.css: Stylesheet for the Material Green Theme</li>
<li>styles/jqx.android.css: Stylesheet for the Android Theme</li>
<li>styles/jqx.arctic.css: Stylesheet for the Arctic Theme</li>
<li>styles/jqx.web.css: Stylesheet for the Web Theme</li>
<li>styles/jqx.black.css: Stylesheet for the Black Theme</li>
<li>styles/jqx.blackberry.css: Stylesheet for the Blackberry Theme</li>
<li>styles/jqx.bootstrap.css: Stylesheet for the Bootstrap Theme</li>
<li>styles/jqx.classic.css: Stylesheet for the Classic Theme</li>
<li>styles/jqx.dark.css: Stylesheet for the Dark Theme</li>
<li>styles/jqx.darkblue.css: Stylesheet for the DarkBlue Theme</li>
<li>styles/jqx.energyblue.css: Stylesheet for the EnergyBlue Theme</li>
<li>styles/jqx.fresh.css: Stylesheet for the Fresh Theme</li>
<li>styles/jqx.highcontrast.css: Stylesheet for the High Contrast Theme</li>
<li>styles/jqx.light.css: Stylesheet for the Light Theme</li>
<li>styles/jqx.flat.css: Stylesheet for the Flat Theme</li>
<li>styles/jqx.metro.css: Stylesheet for the Metro Theme</li>
<li>styles/jqx.metrodark.css: Stylesheet for the Metro Dark Theme</li>
<li>styles/jqx.mobile.css: Stylesheet for the Mobile Theme</li>
<li>styles/jqx.office.css: Stylesheet for the Office Theme</li>
<li>styles/jqx.orange.css: Stylesheet for the Orange Theme</li>
<li>styles/jqx.shinyblack.css: Stylesheet for the ShinyBlack Theme</li>
<li>styles/jqx.summer.css: Stylesheet for the Summer Theme</li>
<li>styles/jqx.windowsphone.css: Stylesheet for the Windows Phone Theme</li>
<li>styles/jqx.ui-darkness.css: Stylesheet for the UI Darkness Theme</li>
<li>styles/jqx.ui-lightness.css: Stylesheet for the UI Lightness Theme</li>
<li>styles/jqx.ui-le-frog.css: Stylesheet for the UI Le Frog Theme</li>
<li>styles/jqx.ui-overcast.css: Stylesheet for the UI Overcast Theme</li>
<li>styles/jqx.ui-redmond.css: Stylesheet for the UI Redmond Theme</li>
<li>styles/jqx.ui-smoothness.css: Stylesheet for the UI Smoothness Theme</li>
<li>styles/jqx.ui-start.css: Stylesheet for the UI Start Theme</li>
<li>styles/jqx.ui-sunny.css: Stylesheet for the UI Sunny Theme</li>
</ul>
<ul>
<li>jqwidgets - Javascript components</li>
<li>jqwidgets-vue - Vue components</li>
<li>jqwidgets-react-tsx - React components.</li>
<li>jqwidgets-ts - Angular components.</li>
<li>jqwidgets-ng - Angular components as modules. In this folder, you will be able to build and modify the Angular modules. For usage with Angular, you can also use: <a href="https://www.npmjs.com/package/jqwidgets-ng" target="_blank">https://www.npmjs.com/package/jqwidgets-ng</a>
</ul>
<br/><br/>
styles/images: contains images referenced in the stylesheet files
<br/><br/>
Files for individual widgets and plug-ins. Include depending on project needs:
<ul>
<li>jqxangular.js: AngularJS integration plug-in</li>
<li>jqxbargauge.js: BarGauge widget</li>
<li>jqxbuttons.js: Button, RepeatButton, SubmitButton & ToggleButton widgets</li>
<li>jqxbulletchart.js: BulletChart widget</li>
<li>jqxbuttongroup.js: Button group widget</li>
<li>jqxcalendar.js: Calendar widget</li>
<li>jqxcombobox.js: ComboBox widget</li>
<li>jqxcomplexinput.js: Complex Numbers TextBox widget</li>
<li>jqxchart.core.js: Chart widget's Core</li>
<li>jqxchart.rangeselector.js: Chart Range Selector</li>
<li>jqxchart.api.js: Chart API</li>
<li>jqxchart.annotations.js: Chart's annotations</li>
<li>jqxchart.waterfall.js: Waterfall Chart</li>
<li>jqxcheckbox.js: CheckBox widget</li>
<li>jqxdate.js: DateTime plug-in</li>
<li>jqxdata.js: Data Source plug-in</li>
<li>jqxdata.export.js: Data Export plug-in</li>
<li>jqxdatetimeinput.js: DateTimeInput widget</li>
<li>jqxcolorpicker.js: Color Picker widget</li>
<li>jqxdatatable.js: DataTable widget</li>
<li>jqxdocking.js: Docking widget</li>
<li>jqxdropdownbutton.js: DropDown Button widget</li>
<li>jqxdragdrop.js: DragDrop plug-in</li>
<li>jqxdraw.js: Draw Plugin.</li>
<li>jqxdockpanel.js: DockPanel widget</li>
<li>jqxdockinglayout.js: Docking Layout widget</li>
<li>jqxdropdownlist.js: DropDownList widget</li>
<li>jqxeditor.js: Editor widget</li>
<li>jqxexpander.js: Expander widget</li>
<li>jqxfileupload.js: FileUpload widget</li>
<li>jqxformattedinput.js: Binary, Octal, Hex TextBox widget</li>
<li>jqxform.js: Form widget.</li>
<li>jqxgrid.js: Grid widget</li>
<li>jqxgrid.sort.js: Grid Sort plug-in</li>
<li>jqxgrid.filter.js: Grid Filter plug-in</li>
<li>jqxgrid.grouping.js: Grid Grouping plug-in</li>
<li>jqxgrid.selection.js: Grid Selection plug-in</li>
<li>jqxgrid.columnsresize.js: Grid Columns Resize plug-in</li>
<li>jqxgrid.columnsreorder.js: Grid Columns Reorder plug-in</li>
<li>jqxgrid.pager.js: Grid Pager plug-in</li>
<li>jqxgrid.edit.js: Grid Editing plug-in</li>
<li>jqxgrid.storage.js: Grid Save/Load state plug-in</li>
<li>jqxgrid.aggregates.js: Grid Aggregates plug-in</li>
<li>jqxgauge.js: Radial and Linear Gauge widget</li>
<li>jqxheatmap.js: Heatmap widget</li>
<li>jqxinput.js: TextBox widget</li>
<li>jqxknockout.js: Knockout integration plug-in</li>
<li>jqxknob.js: Knob widget</li>
<li>jqxkanban.js: Kanban widget</li>
<li>jqxlayout.js: Layout widget</li>
<li>jqxlistbox.js: ListBox widget</li>
<li>jqxloader.js: Loader widget</li>
<li>jqxmaskedinput.js: Masked TextBox widget</li>
<li>jqxmenu.js: Menu widget</li>
<li>jqxnavigationbar.js: NavigationBar widget</li>
<li>jqxnavbar.js: NavBar widget</li>
<li>jqxnotification.js: Notification widget</li>
<li>jqxnumberinput.js: NumberInput TextBox widget</li>
<li>jqxpanel.js: Panel widget</li>
<li>jqxpopover.js: Popover widget</li>
<li>jqxprogressbar.js: ProgressBar widget</li>
<li>jqxpasswordinput.js: Password input widget</li>
<li>jqxpivotgrid.js: Pivot Grid widget.</li>
<li>jqxrating.js: Rating widget</li>
<li>jqxradiobutton.js: RadioButton widget</li>
<li>jqxrangeselector.js: RangeSelector widget</li>
<li>jqxresponse.js: Response plug-in</li>
<li>jqxribbon.js: Ribbon widget</li>
<li>jqxresponsivepanel.js: Responsive Panel widget</li>
<li>jqxswitchbutton.js: Switch Button widget</li>
<li>jqxscrollbar.js: ScrollBar widget</li>
<li>jqxscrollview.js: ScrollView widget</li>
<li>jqxsplitter.js: Splitter widget</li>
<li>jqxslider.js: Slider widget</li>
<li>jqxscheduler.js: Scheduler widget</li>
<li>jqxscheduler.api.js: Scheduler API plugin</li>
<li>jqxsortable.js: Sortable plugin</li>
<li>jqxtabs.js: Tabs widget</li>
<li>jqxtree.js: Tree widget</li>
<li>jqxtagcloud.js: Tagcloud widget</li>
<li>jqxtreemap.js: TreeMap widget</li>
<li>jqxtimepicker.js: TimePicker widget</li>
<li>jqxtreegrid.js: TreeGrid widget</li>
<li>jqxtoolbar.js: Toolbar widget</li>
<li>jqxtooltip.js: ToolTip widget</li>
<li>jqxvalidator.js: Validation plug-in</li>
<li>jqxwindow.js: Window widget</li>
<li>jqx-all.js</li>
</ul>
<h2>2.Examples</h2>
<ul>
<li>Individual widget/component examples are located in the <strong>/demos</strong> directory</li>
<li>The Javascript examples are located in the <strong>/demos/Javascript & JQuery/</strong> directory</li>
<li>The mobile examples are located in the <strong>/demos/Javascript & JQuery/mobiledemos/</strong> directory</li>
<li>The php & mysql integration demos are located in the <strong>/demos/PHP directory/</strong>.
All php integration samples use and require the Northwind Database(/phpdemos/Northwind.MySQL5.sql). </li>
<li>Angular examples are located in the <strong>/demos/Angular directory/</strong>.</li>
<li>Vue examples are located in the <strong>/demos/Vue.js/</strong> directory.</li>
<li>React examples are location in the <strong>/demos/React/</strong> directory.</li>
<li>ASP .NET examples are located in the <strong>/demos/ASP.NET MVC/ and /demos/ASP.NET Tag Helpers/</strong> directories.</li>
<li>JSP examples are in <strong>/demos/JSP directory/</strong>.</li>
<li>Custom Elements/Web Components are in <strong>/demos/Web Components directory/</strong>.</li>
<li>Stackblitz and Codesandbox Quick Start examples - <a target="_blank" href="https://stackblitz.com/github/jqwidgets/angular_demos/tree/master/grid/defaultfunctionality/">Angular</a>,
<a target="_blank" href="https://codesandbox.io/s/github/jqwidgets/vue/tree/master/grid/defaultfunctionality">Vue</a>,
<a target="_blank" href="https://codesandbox.io/s/github/jqwidgets/react-tsx/tree/master/grid/defaultfunctionality">React</a>
</li>
</ul>
<p>Any examples that use Ajax need to be on a Web Server/LocalHost in order to work correctly.</p>
<h2>3.Documentation</h2>
Browse the documentation and examples online on our website: <a href="https://www.jqwidgets.com/">https://www.jqwidgets.com/</a>
<h2>4.Other files</h2>
The /scripts, /images, /styles folders contain the jquery library and
other files used by the demo only.
<h2>5.Support</h2>
<p>
<p>e-mail: <a href="mailto: support@jqwidgets.com">support@jqwidgets.com</a></p>
<p>forums: <a target="_blank" href="https://www.jqwidgets.com/community">https://www.jqwidgets.com/community/</a></p>
</p>
<h2>6. Other products</h2>
ES6 Web Components & Custom Elements: <a target="_blank" alt="https://www.htmlelements.com/" href="https://www.htmlelements.com/">https://www.htmlelements.com/</a>
<div style="position: absolute; top: 5px; right: 5px;">
<a href="https://www.jqwidgets.com/" alt="https://www.jqwidgets.com/"><img alt="https://www.jqwidgets.com/" target="_blank" title="https://www.jqwidgets.com/" src="https://www.jqwidgets.com/wp-content/design/i/logo-jqwidgets.png"/></a>
</div>
</body>
</html>