0

Script tag Order of execution is not correct In below Ext. JS code

<!DOCTYPE html>
      <html>
        <head>
          <link
                href="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/classic/theme-classic/resources/theme-classic-all.css"
                rel="stylesheet" />
            <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/ext-all.js"></script>
        
            <script type="text/javascript" defer>
                Ext.onReady(function () {
                    Ext.create('Ext.Panel', {
                        renderTo: 'testId',
                        height: 200,
                        width: 600,
                        title: 'Normal Panel',
                        html: 'Normal Panel Html'
                    });
                });
            </script>
            <br />
            <script type="text/javascript" defer>
                Ext.onReady(function () {
                    var childPanel_1 = Ext.create('Ext.panel.Panel', {
                        title: 'Panel in Container',
                        html: 'Panel in Container html',
                        width: '35%',
                    });
                    Ext.create('Ext.container.Viewport', {
                        renderTo: Ext.getBody(),
                        items: [childPanel_1]
                    });
                });  
            </script>
        </head>  
        <body>
            <div id="testId" />
        </body>
        </html>

I am getting below Output: enter image description here

Could someone help me out here, how I could preserved the order of script tags. Also the reason, why it is happening so.

Kms
  • 1,082
  • 2
  • 11
  • 27
  • Script tag are async in nature. You can either load them in sync way or use callback fashion to execute them. This will ensure its execution sequence. – Tejas Jun 05 '21 at 10:21
  • You might want to use only one Ext.onReady function and bootstrap the app within one function body? – hwsw Jun 05 '21 at 10:57
  • Does this answer your question? [load and execute order of scripts](https://stackoverflow.com/questions/8996852/load-and-execute-order-of-scripts) – aaandri98 Jul 26 '21 at 13:13

0 Answers0