CODEWITHSUNDEEP
javascriptextjs
Freakyuser
Freakyuser

Reputation: 2814

Positioning of Ext.msg.show() - Extjs

I am trying to position my msg Box but in vain.
The following is my code for the box:

var msg = Ext.Msg.show({     
 msg:'<br><br>'+'Enter Valid Quatity',
 buttons: Ext.Msg.OK,
 modal: false,
 animEl: 'mb9',
 cls: 'msgbox',
 fn: function(btn){
  if(btn == 'ok'){   
  myMasks.hide();
  }
 }
});

css hack:

<style type="text/css">
 .msgbox{
  left: 257px!important;
  top: 266px!important;
  width: 250px;
  height: 110px;
  position: absolute;
  box-shadow: 0 0px 0px!important;
 }
 .x-css-shadow{
 display:none !important;
 }
</style>

When I hack the css to position the box, the shadow is visible. I hid this shadow in Mozilla again using css but unable to do the same in IE.

Also I followed the answer given in this link with no use.

Can anyone please provide me a solution to either position the box directly using the config properties of Extjs or hide the shadow of the box in IE successfully?

Upvotes: 0

Views: 2545

Answers (1)

Guilherme Lopes
Guilherme Lopes

Reputation: 4760

Ok, you can remove the animEl config as this is not valid for ExtJS 4 and 5. And use the setXY() method to place the MessageBox whereever you want: 

var msg = Ext.Msg.show({     
    msg:'<br><br>'+'Enter Valid Quatity',
    buttons: Ext.Msg.OK,
   //modal: false, */ No need for this because modal defaults to false */
   fn: function(btn){
       if(btn == 'ok'){   
           myMasks.hide();
       }
   }
});
Ext.Msg.setXY([257,266],false); // You can set the second argument to another object if you want the box to animate from it.

Upvotes: 1

Related Questions