topic Re: disable/hide resize handle for Widget in ArcGIS Web AppBuilder Questions

disable/hide resize handle for Widget

VikramS — Thu, 02 Jul 2015 17:46:33 GMT

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

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Sat, 11 Dec 2021 22:13:00 GMT

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

Re: disable/hide resize handle for Widget

VikramS — Thu, 02 Jul 2015 19:39:55 GMT

Thanks Robert .

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Thu, 02 Jul 2015 19:46:51 GMT

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"

Re: disable/hide resize handle for Widget

KevinThompson — Thu, 06 Jun 2019 18:03:40 GMT

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

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Thu, 06 Jun 2019 18:17:17 GMT

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.

Re: disable/hide resize handle for Widget

KevinThompson — Thu, 06 Jun 2019 19:49:28 GMT

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

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Sat, 11 Dec 2021 22:13:02 GMT

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);
      },‍‍‍‍‍‍

Re: disable/hide resize handle for Widget

KevinThompson — Fri, 07 Jun 2019 15:07:31 GMT

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

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Fri, 07 Jun 2019 15:12:14 GMT

Kevin,

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

Re: disable/hide resize handle for Widget

KevinThompson — Fri, 07 Jun 2019 15:38:59 GMT

Hey Robert,

Your right I just noticed! I also can't use .dojox_layout_ResizeHandle_2 as every time you open and close a widget the id changes. I guess its back to trouble shooting the JS. Is there anything I am doing wrong within the Widget.js file?

Currently I just added the code to the bottom after the refreshLegend function.

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Fri, 07 Jun 2019 15:41:33 GMT

Your widget does not already have a postCreate function?

Re: disable/hide resize handle for Widget

KevinThompson — Fri, 07 Jun 2019 16:55:26 GMT

I have no existing postcreate function within the Basemap Gallery Widget.js I had to add the postcreate function to the file.

The only file which contains an existing postcreate function is the Jimu.js WidgetPlaceholder.js file?

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Fri, 07 Jun 2019 17:04:12 GMT

Kevin,

Was the attached Widget.js suppose to have any of your code change attempts?

Re: disable/hide resize handle for Widget

KevinThompson — Fri, 07 Jun 2019 17:10:26 GMT

Hey Robert,

That was a blank copy of the file to show there was no base postcreate function here is my failed code

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Sat, 11 Dec 2021 22:13:05 GMT

Kevin,

OK in that one you have the postCreate function added but you did not add the defines for the domStyle or dojoQuery.

define([
    'dojo/_base/declare',
    'dijit/_WidgetsInTemplateMixin',
    "dojo/Deferred",
    'jimu/BaseWidget',
    'jimu/portalUtils',
    'jimu/PanelManager',
    'jimu/portalUrlUtils',
    'jimu/utils',
    "esri/dijit/Basemap",
    "esri/dijit/BasemapLayer",
    'esri/dijit/BasemapGallery',
    "./a11y/Widget",
    'dojo/_base/lang',
    'dojo/_base/array',
    "dojo/_base/html",
    "dojo/query",
    'dojo/on',
    'dojo/promise/all',
    './utils',
    'dojo/query',
    'dojo/dom-style',
    'jimu/dijit/LoadingIndicator',
  ],
  function(
    declare,
    _WidgetsInTemplateMixin,
    Deferred,
    BaseWidget,
    portalUtils,
    PanelManager,
    portalUrlUtils,
    jimuUtils,
    Basemap,
    BasemapLayer,
    BasemapGallery,
    a11y,
    lang,
    array,
    html,
    query,
    on,
    all,
    utils,
    dojoQuery, 
    domStyle) {
....‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: disable/hide resize handle for Widget

KevinThompson — Fri, 07 Jun 2019 17:38:19 GMT

Hello Robert,

I just checked and the code does work until you restart the widget and then it pops back for some reason.

I appreciate your patience with this! I am sure its working fine on your end.

Kevin

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Fri, 07 Jun 2019 17:46:17 GMT

Kevin,

It is working fine on my end, lol. Here is the full basemap gallery widget code with changes:

Re: disable/hide resize handle for Widget

KevinThompson — Fri, 07 Jun 2019 17:55:52 GMT

Robert,

I just notice that the code only works on my end for the first time the widget is opened and then if it is closed it stops working. This might be due to some of my changes within the application. I will see if I can find out what is causing it.

Thank you for your help!! Your the best

PS: I got the logo in the header widget to be larger! Thanks for the links this morning

Re: disable/hide resize handle for Widget

RobertScheitlin__GISP — Fri, 07 Jun 2019 18:03:25 GMT

Kevin,

That is strange. I can open and close it as many times as I want and it stays gone.