Skip to content
This repository has been archived by the owner. It is now read-only.

Commit 31edbdf

Browse files
SyncfusionBuildSyncfusionBuild
committed
Latest source merged from Syncfusion
1 parent e27d344 commit 31edbdf

File tree

4 files changed

+162
-3
lines changed

4 files changed

+162
-3
lines changed

‎js/Calculate/Getting-Started.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -309,7 +309,7 @@ calcObj.setValueRowCol = function (sheetID, value, row, col) {
309309
310310
### Evaluating formula
311311
312-
The given formula in the text box can be evaluated using `parseAndComputeFormula` by click on the `compute` button.
312+
The given formula in the text box can be evaluated using `parseAndComputeFormula` by clicking on the `compute` button.
313313
314314
{% highlight javascript %}
315315

‎js/Configuration-and-Deployment.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ N>'bower init'
9393

9494
You can install the Syncfusion Bower package from a local directory. To perform this follow the below steps.
9595

96-
1. Navigate the [Syncfusion JavaScript Bower repository](https://github.com/syncfusion/JavaScript-Widgets/) location on GitHub and download the repository as zip by click the “Download ZIP” button and extract the contents in your computer’s any of the local directory.
96+
1. Navigate the [Syncfusion JavaScript Bower repository](https://github.com/syncfusion/JavaScript-Widgets/) location on GitHub and download the repository as zip by clicking the “Download ZIP” button and extract the contents in your computer’s any of the local directory.
9797

9898
![](Installation-and-Deployment_images/Installation-and-Deployment_img8.jpeg)
9999

@@ -168,7 +168,7 @@ N> 'npm init'
168168

169169
Install the Syncfusion JavaScript npm package from a local directory.
170170

171-
1. Navigate the [Syncfusion JavaScript repository](https://github.com/syncfusion/JavaScript-Widgets) location on GitHub and download the repository as zip by click the “Download ZIP” button and extract the contents in your computer’s any of the local directory.
171+
1. Navigate the [Syncfusion JavaScript repository](https://github.com/syncfusion/JavaScript-Widgets) location on GitHub and download the repository as zip by clicking the “Download ZIP” button and extract the contents in your computer’s any of the local directory.
172172

173173
![](Installation-and-Deployment_images/npminstallationsteps_img4.jpeg)
174174

‎js/Release-notes/v18.4.0.49.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
---
2+
title: Essential Studio for JavaScript Weekly Nuget Release Release Notes
3+
description: Essential Studio for JavaScript Weekly Nuget Release Release Notes
4+
platform: js
5+
documentation: ug
6+
---
7+
8+
# Essential Studio for JavaScript Release Notes
9+
10+
{% include release-info.html date="March 23, 2021" version="v18.4.0.49" %}
11+
12+
13+
{% directory path: _includes/release-notes/v18.4.0.49 %}
14+
15+
{% include {{file.url}} %}
16+
17+
{% enddirectory %}

‎js/compatibility-ej1-ej2.md

Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
---
2+
layout: post
3+
title: Compatibility with Syncfusion Essential JS1 and JS2 widgets
4+
description: Learn how to show Compatibility with Syncfusion Essential JS1 and JS2 widgets with Javascript platform.
5+
platform: js
6+
control: Introduction
7+
documentation: ug
8+
---
9+
10+
# Compatibility with Essential JS 2 Components
11+
12+
The Essential JS 1 components can be compatible with the Essential JS 2 components in the same web page. For this we need to follow the below steps,
13+
14+
15+
## Script Compatibility
16+
17+
We should maintain the script reference order (refer Essential JS 1 before Essential JS 2) for this, and we should extend the Essential JS 1 namespace with Essential JS 2.
18+
Please find the below code for script references.
19+
20+
{% highlight html %}
21+
22+
<!-- Essential JS 1 script -->
23+
<script src="http://cdn.syncfusion.com/16.1.0.24/js/web/ej.web.all.min.js"></script>
24+
<!-- Essential JS 2 script -->
25+
<script src="http://cdn.syncfusion.com/ej2/dist/ej2.min.js" type="text/javascript"></script>
26+
<script>
27+
//Extend ej namespace with Syncfusion
28+
$.extend(ej, Syncfusion)
29+
</script>
30+
31+
{% endhighlight %}
32+
33+
34+
## Theme Compatibility
35+
36+
We have provided compatibility css files for all the Essential JS 1 web components in all the themes, since we have used same classes for Essential JS 1 and Essential JS 2 components. So, the both classes were overrides with each other. We have provided this support for all the themes which are available in Essential JS 1.
37+
38+
You can find the compatibility theme files which are ends with the name compatibility in the below mentioned location.
39+
40+
widgets.core - **(installed location)** \Syncfusion\Essential Studio\{RELEASE_VERSION}\ JavaScript\assets\css\web\ej.widgets.core.compatibility.min.css
41+
theme - **(installed location)**\Syncfusion\Essential Studio\{RELEASE_VERSION}\ JavaScript\assets\css\web\default-theme\ej.theme.compatibility.min.css
42+
43+
N>We have illustrated flat azure theme in this document. However, all the themes in Essential JS 1 have compatibility support.
44+
45+
46+
## Compatibility Themes
47+
48+
1. Bootstrap
49+
2. Azure and its variants (Flat, Dark, Gradient)
50+
3. Saffron and its variants
51+
4. Lime and its variants
52+
5. High Contrast 01
53+
6. High Contrast 02
54+
7. Material
55+
8. Office 365
56+
57+
You can get the compatibility css in the following way.
58+
59+
* You can get the compatibility theme files from the below build installed location.
60+
61+
**(installed location) **\Syncfusion\Essential Studio\ {RELEASE_VERSION} \ JavaScript\assets\css\web
62+
63+
64+
## Creating Sample Application for Essential JS 1 Component
65+
66+
67+
### Create Essential JS 1 Button
68+
69+
You can refer the [`Getting Started`](https://help.syncfusion.com/js/button/getting-started#create-button-widget) to create the button component. Now you can modify the sample’s css references as below to refer the compatibility themes.
70+
71+
Please refer the below code snippet.
72+
73+
{% highlight html %}
74+
75+
<!-- Style sheet for default theme (flat Azure) -->
76+
<link href="http://cdn.syncfusion.com/16.1.0.24/js/web/flat-azure/ej.web.all.compatibility.min.css" rel="stylesheet" />
77+
78+
{% endhighlight %}
79+
80+
81+
### Add Essential JS 2 Button
82+
83+
You can refer the [`Getting Started`](http://npmci.syncfusion.com/production/documentation/getting-started/JavaScript-ES5.html?lang=es5) for button creation and made the Essential JS 2 related changes in the same html file.
84+
85+
Please find the below html code.
86+
87+
{% highlight html %}
88+
89+
<!DOCTYPE html>
90+
<html xmlns="http://www.w3.org/1999/xhtml">
91+
92+
<head>
93+
<title>Essential JS 2 - Essential JS 1</title>
94+
<!-- Essential JS 1 default theme -->
95+
<link href=" http://cdn.syncfusion.com/16.1.0.24/js/web/flat-azure/ej.web.all.compatibility.min.css " rel="stylesheet" type="text/css" />
96+
<!-- Essential JS 2 material theme -->
97+
<link href="https://cdn.syncfusion.com/ej2/styles/compatibility/material.css" rel="stylesheet" type="text/css" />
98+
<!-- Essential JS 1 scripts -->
99+
<script src="https://cdn.syncfusion.com/js/assets/external/jquery-1.10.2.min.js" type="text/javascript"></script>
100+
<script src="https://cdn.syncfusion.com/js/assets/external/jquery.easing.1.3.min.js" type="text/javascript"></script>
101+
<script src=" https://cdn.syncfusion.com/16.1.0.24/js/web/ej.web.all.min.js" type="text/javascript"></script>
102+
<!-- Essential JS 2 script -->
103+
<script src=" https://cdn.syncfusion.com/ej2/dist/ej2.min.js" type="text/javascript"></script>
104+
</head>
105+
106+
<body>
107+
<div style="margin: 50px;">
108+
<!-- Add HTML Button element for Essential JS 2 -->
109+
<button id="btn2">Essential JS 2</button>
110+
</div>
111+
<div style="margin: 50px;">
112+
<!-- Add HTML Button element for Essential JS 1 -->
113+
<button id="btn1">Essential JS 1</button>
114+
</div>
115+
</body>
116+
117+
</html>
118+
119+
{% endhighlight %}
120+
121+
Please find the below Javascript code.
122+
123+
{% highlight html %}
124+
125+
<script>
126+
// Extend ej namespace with Syncfusion
127+
$.extend(ej, Syncfusion);
128+
// Initialize Essential JS 1 JavaScript Button component
129+
$("#btn1").ejButton();
130+
// Initialize Essential JS 2 JavaScript Button component
131+
var button = new ej.buttons.Button({});
132+
button.appendTo('#btn2');
133+
</script>
134+
135+
{% endhighlight %}
136+
137+
138+
### Run the Sample
139+
140+
Now run the html page which contains Essential JS 1 Button and Essential JS 2 Button and the output look like below,
141+
142+
![Compatibility](compatibility_images/compatibility.png)

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy