Hide form button after click - JS

  • 13 June 2017
  • 5 replies
  • 69 views
jesse_mchargue
Userlevel 6
Badge +12

Hello all - 

I am running into a wall with this and can't figure out how to hide a button after it has been clicked.

Ultimately, I want to all a user to click a button, hide the button, and replace it with an image (think check-mark or red 'X'). I will also need to have a way to "reset" the form buttons in the event that one is miss-clicked and the user needs to go back.

I have been playing with setting other fields and running rules against them, but no luck. Would CSS be a better approach, and if so, how (examples)?

Working in 2010 and O365.

Thanks

5 replies

E
Userlevel 5
Badge +14

does it have to be 'real' button control?

what about choice control rendered as buttons?

my idea is to have a choice control with single option. so you get single button rendered

until choice button is clicked, its value is empty, once it's clicked it gets value of that single option.

based on the value a rule could be set up to hide the choice control.

I'm not sure what exact requirements are regarding 'reset', but if choice value is saved into list filed then simple removing list field's value should set it uninitialized and so again shown on form.

S
Badge +9

Hi Jesse,

This can be accomplished using JavaScript. The following will get you over the line. I've also included an attachment of the form I've tested this against.

NWF$(document).ready(function () {
NWF$('.ntxImage').hide();
NWF$('.btnHide').click(function(){
hideButton();
});
NWF$('.btnReset').click(function(){
showButton();
});
function hideButton() {
NWF$('.btnHide').hide();
NWF$('.ntxImage').show();
}
function showButton() {
NWF$('.btnHide').show();
NWF$('.ntxImage').hide();
}
});‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Thank you,

Sean

jesse_mchargue
Userlevel 6
Badge +12

Thanks for this Sean Fiene‌! 

Exactly what I needed. Now I just need to clean up the JS, but it is working happy.png

I attached what I have thus far if interested (O365). I will post a blog as soon as I polish it up a bit happy.png

204236_pastedImage_3.png

204237_pastedImage_4.png

S
Badge +9

Welp, there goes all my productivity!

I love this idea, awesome work Jesse!

Thank you for sharing,

Sean Fiene

jesse_mchargue
Userlevel 6
Badge +12

HAHA...I know the feels happy.png

I tweeked some things... I am thinking perhaps save the stats and submit it back to the list...

204593_pastedImage_2.png

Also, I want to try a "Battleship" game or "Guess Who"... too many ideas, not enough time happy.png

Reply


View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings