Question

Approve/Reject button based on selection?

Forms

Updated March 15, 2016

asked on March 9, 2016

Is it possible to show and hide Approve and Reject based on selection from a dropdown?

I have a complex process where I need to record the decision in a dropdown because Actions only show the previous Approver's action. Then my process boils down to if any Rejects and if all Approve.

Thanks!

0 0

Answer

SELECTED ANSWER

replied on March 14, 2016

Hello Lidija,

Sure! This code should make it so that it will hide and show the corresponding buttons when the dropdown changes.

$(document).ready(function () {
  $("#q1").on("change", function() {
   	 var check = $("#Field1").val();
   	 if(check == "App") {
  		$(".action-btn.Reject").hide();
     	   $(".action-btn.Approve").show();
  		}
   	 if(check == "Rej") {
    	$(".action-btn.Approve").hide();
       	$(".action-btn.Reject").show();
   	 }
	});
});

Where the #q1 id is the id of the dropdown.

Hope this helps!

1 0

Replies

replied on March 10, 2016

Hello Lidija,

Here is some code that is able to hide the Approve or Reject button based on a selection in the dropdown.

$(document).ready(function () {
    var check = $("#Field1").val();
    if(check == "App") {
  		$(".action-btn.Reject").hide();
        //$(".action-btn.checkRequired.Submit").hide();
  	}
    if(check == "Rej") {
    	$(".action-btn.Approve").hide();
    }
});

A few things to note, the "#Field1" is the id of the dropdown box which can be found by right clicking the dropdown box and clicking "Inspect" or "Inspect Element".

The "App" and "Rej" are the values that I used for the dropdown as shown in the picture below.

The ".action-btn.Reject" and ".action-btn.Approve" are the default names of the Approve and Reject button.

Hope this helps!

0 0

replied on March 14, 2016

Winston, thank you for taking the time to help me with this! I tried it a few different ways and it is not working for me, let me try to explain what I am doing so we can figure our where I am messing up.

Upon inspect I determined that my dropdown name="Field24" and id="Field24" but since we are talking about the id, I assume that is why you have a '#' in front of the field name.

So in my code I have replaced #Field1 with #Field24 and I have added the values to choices - just like you did. Do I have to have anything in the CSS class of that dropdown?

I assume that you are calling $(".action-btn.Approve") because it is a class? Since from inspect I get that the class is "action-btn Approve".

Thank you!

0 0

View 1 previous reply

replied on March 14, 2016

Hello Lidija,

No problem, all of your things seem correct and I did not have to do anything in the CSS. I did forget to ask if you wanted to show/hide the buttons upon changing the dropdown or was it that you wanted to show/hide the buttons to the next Approver?

The code I provided will work in the second case as shown below:

In the above picture, I selected Approve in the dropdown and submit the form. The resulting task review will look like this

Hope that provides clarification!

0 0

replied on March 14, 2016

Ah I see! Could we please make it so that it changes on change of dropdown? I am not very proficient in JavaScript but isn't it something to do with 'onchange'?

Thank you very much!

0 0

SELECTED ANSWER

replied on March 14, 2016

Hello Lidija,

Sure! This code should make it so that it will hide and show the corresponding buttons when the dropdown changes.

$(document).ready(function () {
  $("#q1").on("change", function() {
   	 var check = $("#Field1").val();
   	 if(check == "App") {
  		$(".action-btn.Reject").hide();
     	   $(".action-btn.Approve").show();
  		}
   	 if(check == "Rej") {
    	$(".action-btn.Approve").hide();
       	$(".action-btn.Reject").show();
   	 }
	});
});

Where the #q1 id is the id of the dropdown.

Hope this helps!

1 0

replied on March 15, 2016

That worked, thank you so very very very much!

0 0

You are not allowed to follow up in this post.

Question

Question

Approve/Reject button based on selection?

Answer

Replies

Sign in to reply to this post.