disable/hide resize handle for Widget

5023
20
07-02-2015 10:46 AM
VikramS
Occasional Contributor

How to disable/hide the resize handle for specific widget in Webappbuilder ?

0 Kudos
20 Replies
RobertScheitlin__GISP
MVP Emeritus

Vikram,

  There is no configuration for this, but if you add some code you can accomplish this.

In your widget you wish to disable the resize on just add this code and requires:

In the postCreate function add:

domStyle.set(dojoQuery(".dojoxResizeHandle.dojoxResizeNW")[0],
                             'display',
                             'none');

Add these requires:

'dojo/query',
'dojo/dom-style',

along with their vars:

dojoQuery, domStyle
VikramS
Occasional Contributor

Thanks Robert .

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Vikram,

Glad to help. Now it is your turn to help the community by marking this question as answered. All you have to do is click the "Correct Answer" link (the one with the little green star) on the post that provided the answer for you. If the answer was not provided by one of the responders then you can mark any of the replies that you received as helpful by clicking on the "Actions" menu and choosing "Mark as Helpful"

0 Kudos
KevinThompson
New Contributor III

Hello Robert,

Thank you for posting this! I am trying to implement this in my application, but am running into trouble.

Do you put this within the Widget.js file within the Widgets folder? Also I am not sure if i created the vars and set the requirements correctly as you instructed.

postCreate: function() {
var dojoQuery = require('dojoQuery')
var domStyle = require('domStyle')
domStyle.set(dojoQuery(".dojoxResizeHandle.dojoxResizeNW")[0],
'display',
'none');
},

Kind Regards,

Kevin

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Kevin,

   No that is not how to add the requires. In the Widget.js at the very top of that file you will find the other modules in the define array that is where you add the dojo/query and dojo/dom-style. The domStyle.set does go in the Widget.js postcreate function.

KevinThompson
New Contributor III

Hello Robert,

I added the requirements within define() and the variables within the function().

I must still be missing something because it is not being removed?

Appreciate your help, sorry I am new at this

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Kevin,

   OK this seems to work:

      postCreate: function() {
        this.inherited(arguments);
        setTimeout(lang.hitch(this,function(){
          domStyle.set(dojoQuery(".dojoxResizeHandle", this.domNode.parentNode.parentNode.parentNode)[0], 'display', 'none');
        }), 200);
      },
0 Kudos
KevinThompson
New Contributor III

Hello Robert, 

Thanks for helping me on all my difficulties! I was unable to make the JS work but I did manage to use CSS to hide it within the Widgets style.css file.

.dojoxResizeHandle {
visibility: hidden !important;
}

Kind Regards,

Kevin

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Kevin,

   That will work if you want to hide it for all widgets.

0 Kudos