Removing OK and Cancel buttons from spModal

shawnbaar · ‎06-28-2018

Good morning,

I've tried asking this question a couple of times and no one who has seen it seems to know. I need to disable the OK and the Cancel buttons that appear in the spModal popup window. I think I have found the place to make the necessary change (Client Controller of the widget making the spModal call), I just need the correct syntax to hide them.

The function looks like this:

function(spModal) {
var c = this;
c.onWidget = function(widgetId, widgetInput) {
  spModal.open({
   title: 'Generic Login',
   button: ['ok', false],
   widget: widgetId,
   widgetInput: widgetInput || {}
  }).then(function(){
   console.log('Portal Generic Widget dismissed');
  });
};
}

The widget editor is fine with the syntax as it is, but the OK button is still appearing. Does anyone have any experience with hiding the buttons that are enabled by default on the spModal?

Thanks,

Shawn

ChrisBurks · ‎07-07-2018

Hi Shawnbaar,

For future reference these values for the buttons property in spModal

buttons: [
                {label:'', hide: true},
                {label:'', hide: true}
   ]
buttons: ['','']

may give you the result you want however, if inspected in the console you'll will see they cause an error. To be exact the error is "Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed." This is because the code behind the buttons property in spModal uses ngRepeat to render the buttons and angularjs doesn't like it when items in an array have duplicates.

Knowing this information the easiest way to not include buttons is to assign the buttons property with an empty array:

buttons: []

ngRepeat won't loop through an empty array by design. No errors.

Also note that if you don't supply the "buttons" property in the object for spModal.open it will by default render the buttons. In the prior code given above, the reason it didn't work for you is that the code used "button" which isn't the property that spModal is looking for. Thus when the code rendered the "buttons" property wasn't found resulting in buttons displaying when you tried it.

I hope this helps.

View solution in original post

shawna · ‎06-28-2018

The 'buttons' option takes an array that contains the buttons to show on the dialog. The default is Cancel and OK. It will hide the buttons when both were set as empty string. Below works for me:

function(spModal) {
  var c = this;
  c.onWidget = function(widgetId, widgetInput) {
  spModal.open({
   title: 'Generic Login',
   button: ['', ''],
   widget: widgetId, 
   widgetInput: widgetInput || {}
  }).then(function(){
   console.log('Portal Generic Widget dismissed');
  });  
 };
}

shawnbaar · ‎06-29-2018

I was unable to make the buttons disappear using the code suggested, but it did help me get to this:

   buttons: [
                {label:'', hide: true},
                {label:'', hide: true}
   ],

The quotes are single and represent the empty string, but for some reason the buttons were persistent until I added the hide portion.

jacque3 · ‎05-28-2019

   buttons: ['', ''],

is working for me , I think it should be buttons not button 🙂

Thank you

shawna · ‎06-29-2018

Interesting. The empty string worked for me. Glad it is finally working for you :).