Removing OK and Cancel buttons from spModal

shawnbaar
Giga Expert

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

1 ACCEPTED SOLUTION

ChrisBurks
Mega Sage

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.

find_real_file.png

I hope this helps.

 

View solution in original post

6 REPLIES 6

ChrisBurks
Mega Sage

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.

find_real_file.png

I hope this helps.

 

spModal.open({
	title: "Thank you!",
	buttons: [
		{label:'', hide: true},
		{label:'', hide: true}
	],
	message: "Glad to hear it! Thank you!"
});

 

The "hide:true" is what worked for me.... thanks!