Solved

Anyone else see a bug when you try to assign a CSS class to the cancel button?


Badge +4

When adding a custom CSS class to the cancel button on a form (mainly used to style and theme based on the branding of my company) it gathers the custom class say, "cancelBtn" and also the other classes, but doesn't have the space between the custom and the form added classes.

 

So the button now looks like (with custom class)

<div class="nf-filler-control-inner">

  <input type="submit" XXXXXXX class="cancelBtnfn-cancel-button nf-disableonsubmit" XXXXXX>

</div>

 

Anyone else see this as well? Possible bug?

icon

Best answer by tphan 15 February 2017, 17:57

View original

10 replies

Userlevel 5
Badge +12

I haven't tried, but why not send it into Nintex support to see if they can replicate it?   

Userlevel 6
Badge +15

Hi there Trang Phan

I just tried this out, and I get this returned:

class="btnCancel nf-filler-control nf-filler-highlightonvalidationerror"

Is that .. not normal?

Userlevel 5
Badge +12

See his text above, using the class "cancelBtn  blends right in with fn-cancel-button" - try testing with class "cancelBtn" if you could and see if it happens.   Thanks!

Userlevel 6
Badge +15

I feel like I'm still missing something?

I don't understand where this fn-cancel-button is coming from...

Badge +4

‌,

Are you using a cancel button, or just a normal button?

I'm talking specifically from a cancel button in Office 365 for Sharepoint Online v 1.2.3.

‌,

I'll put this issue in with Nintex Support.

Badge +4

I've put in a support ticket with Nintex and they have recognized that it is a bug.

Userlevel 5
Badge +13

Hey Rhia Wieclawek‌, I am having the same problem Trang Phan‌ described. In the designer, I assign my Cancel Button the class "cancelButton" and create that in the custom CSS. Then, if I publish the form and go open the form on an item and inspect it, I see cancelButtonnf-cancel-button nf-disableonsubmit

Userlevel 5
Badge +12

Any feedback on this ‌, looks like  ‌ is having a similar issue?

Userlevel 5
Badge +13

Hey Mike Matsako‌, I ended up doing a "workaround" by creating a new button, labeling it "Cancel," and on-click calling NWF.FormFiller.CancelForm(); and applying my CSS Class to the new "cancel" button. This worked! Something about that default cancel button for the moment I guess.

Badge +4

‌,

Good idea with the work around! I've generally avoided the NWF.FormFiller.XXXX methodology because I'm unsure of what they do and I've been implementing my own buttons as well. Though that function seems to be fairly straight forward .

Sorry I didn't see your question sooner, I was quite busy this past week. Another option to consider for the future is to use jQuery and assign the class on form load. It's what I did to bypass the cancel button bug.

NWF$('.nf-cancel-button').addClass('cancelButton'); would be close to what I think you're trying to achieve without losing the actual cancel default button. It can be set anywhere in your custom javascript. I'm guessing you have custom CSS applied to the cancelButton class.

Reply