How to include ExtJs in Your Web Page ?

In order to Use ExtJs Libraries in your webpages , you must download all ExtJS Libraries.

Steps to Download ExtJs Libraries :

  1. Go to this link : http://www.sencha.com/products/extjs/download?page=a
  2. Sencha has provided ExtJs library in two forms - Commercial licence and Open Source Licence.
  3. We are free to use Open Source Licence. Download “Open source Version”.
Downloading EXTJS Library

after downloading you must put them into appropriate folder.

Writing First Example :

<html>
  <head>
        <title>First ExtJs Example</title>
        <link rel="stylesheet"type="text/css" 
              href="lib/extjs/resources/css/ext-all.css"/>
        <script src="lib/extjs/adapter/ext/ext-base.js"></script>
        <script src="lib/extjs/ext-all-debug.js"></script>
  </head>
  <body>
       <!-- Nothing in the body -->
  </body>
</html>

You need to include 2 js files and 1 css file.

Explanation : ExtJs First Example

  • Path of the Libraries must be relative to the Path of HTML file.
  • All the Libraries must be included in sequence.

Sequence of Inclusion :

  1. Main Ext CSS file : ext-all.css
  2. External Js library file
  3. Ext Adapter : ext-base.js
  4. Primary Ext library file : ext-all.js / ext-all-debug.js
  5. Theme file