Remove extjs automatically added classes

2020-07-13 07:35发布

问题:

I am new to Extjs. I am using Extjs 4 in my project. When the ext-all.js is loaded it automatically adds classes to the <body> tag. and all my other css styles are changed with extjs styles. I found in the documentaion that to set Ext.scopeResetCSS property to true, so I add like below.

    Ext.onReady(function(){
      new Ext.Component({
          scopeResetCSS: true
      });
    });

but it doesn't change any thing. I still have the same problem.

Is there any way to stop extjs from automatically adding css classes to the tags? Please help..

This is my code to generate a multi line message box.

<link rel="stylesheet" type="text/css" href="components/com_jobs/js/extjs/resources/css/ext-all.css"/>
<script type="text/javascript" src="components/com_jobs/js/extjs/ext-all.js"></script>

<!-- extjs message box code -->
<script type="text/javascript">

Ext.require([
'Ext.window.MessageBox'
             ]);     

function removeBid(bidid){
    Ext.MessageBox.show({
        title: 'Address',
        msg: 'Please enter your address:',
        width:300,
        buttons: Ext.MessageBox.OKCANCEL,
        multiline: true,
        //fn: showResultText
    });
}
</script>

Am I doing anything wrong??? I want extjs to style only its own components. But now extjs styles are effects my whole page.. Please help.

Thanks.

回答1:

The scopeResetCSS property is part of Ext.buildSettings, which is used at the beginning of the Ext JS initialization sequence. If you want to change it, you have to edit ext-all.js or change the settings in the Sencha JS Builder (which I'm assuming you're not using).

Open ext-all.js in your favorite text editor (one that can handle larger files, preferably) and search for "scopeResetCSS" near the beginning of the file, and you'll find it easy enough.



回答2:

If you are using ExtJS 4.0.2a, then set the scopeResetCSS BEFORE the include.

However, I just switched to ExtJS 4.0.7 and the issue is back. :(



回答3:

I asked a similar question for ExtJS 4.2.1 before coming across this one. The solution I adopted was to modify the DOM once ExtJS was loaded, and add a listener for the DOMNodeInserted event to watch for and handle the automatic creation of ExtJS components like pick lists. If you are interested you can find my answer here: https://stackoverflow.com/a/29934347/857209



标签: extjs4