Solved

How to set value of a yes/no or dropdown based on value of another control (responsive form)

  • 3 March 2022
  • 5 replies
  • 689 views
N

I would like know how to have the SharePoint 2019 responsive form respond to the change in value of a dropdown control to update the value of another control, specifically of the yes/no or dropdown (with Yes and No as options) type.

 

In responsive mode, it doesn't seem to support custom JavaScript (as classic would).  I found 1 rule type that sets the value of a single line text box based on a dropdown, but I don't want the target to be free-form text, rather something selectable like yes/no or a dropdown.

icon

Best answer by northernPenguin 4 March 2022, 17:37

View original

5 replies

A
Badge +8

hey @northernPenguin ,


 


as far as I know it is not possible to do that in responsive forms.

MegaJerk
Userlevel 5
Badge +14

Before I give you the answer to this, I really want to stress that while it *can* be done, it is NOT supported and is unorthodox.


It could break during an update.


It could break because Nintex decides they don't want people doing it.


It could break for any number of reasons!


Be aware that solving the problem this way could lead to a functionality that is, essentially, undocumented and hidden from anyone else who encounters this work at a later date!


 


Alright. Warnings out of the way, here is some context. Because the Rule System of a form is essentially just a place where you're piecing together little snippets of code (or text that gets compiled into code when it's served to you proper), you can actually use javascript inside of it outright. This is why you can use stuff like || and && (logical or, and logical and) inside of it without needing to use the runtime or() / and() functions that they give you.


 


To read more about how the Rule system works in detail, please see my article on the matter here: https://community.nintex.com/t5/Community-blogs/Breaking-The-Rules-A-Dive-Into-The-Nintex-Forms-Rule-System/ba-p/78874


 


Here is a Responsive Form with a Drop Down Choice Control next to a Yes / No Control:



 


The Controls are Configured as such


 


Choice Control:



 


Yes / No Control:



 


Selecting the Yes/No Control, I am going to add a Rule to it



 


Then, in the order shown, rename the rule, set the rule to disable, and then click on the formula editor:



 


Inside of the Formula Builder goes the following code:


(function(formControlCall, dropDown){
var formControlID = formControlCall.split("'")[1] || "";
var targetControl = sourceContext.find("[formcontrolid='" + formControlID + "'].nf-filler-control").find("[formcontrolid][id]");
targetControl.prop("checked", dropDown.toLowerCase() === "alright");
return false;
}("{Control:Self}", control_DropDown))

 


As shown, you need to replace the text of *control_DropDown* with the NAMED REFERENCE of the dropdown control in question. Because I named my dropdown choice control to "control_DropDown", I erase the word *control_DropDown* near the end of my code and replace it by double clicking the Named Reference. If you did it correctly, it should be in red as I show here:



 


Now when we launch the form we can see that whenever we select the "Alright" option from the Dropdown, the Yes/No control is checked:



 



 



 


All that said, this doesn't prevent someone from just changing the checkbox to any particular value they want. If you'd rather lock it down, then you can simply go back to your rule, and change the return value from false to true:



 


Now the Yes / No Control is *always* disabled, but can still be toggled by our code:



 


I hope that this has helped to build a better understanding of the Rule System and what can be done with a little code. Let me know if you need additional help or if this has solved it.


 


Additionally if you would like an explanation of how that code works, let me know. 


 


 


 


 

N

Thanks a lot, that's really neat!  I hadn't encountered the ability to put code directly into the formulas (although I have been using && and || without knowing that was why it works).  I've bookmarked the article you shared and will read through it sometime for more ideas.


 


I did come up with a separate solution that suits my current needs in this situation (and also is Nintex-"safe"), which I'll describe as follows for anyone that wants another solution:


 


I have the dropdown control and Yes/No control, plus added an additional calculated control.  Rather than have the Yes/No control (still named Approval Required) connected to the Approval Required column as it was before, I have the calculated control (named Calc Approval Required) hooked to the AR col.  In the calc. control, I put a formula like this:


If(equals([dropdown control name], "[dropdown choice that needs Yes/No as No]"), false, Approval Required)


Here I have false b/c I found from trial and error that Yes/No actually returns true/false.


 


Then after confirming in Preview that this works, add a hide always rule to the calc. control, and a rule to hide the Yes/No box when the dropdown has the particular value (plus a rule on the Yes/No box to make a selection required when the dropdown doesn't have the particular value).


 


So while this doesn't directly solve the problem as stated (which is to control the Yes/No box directly), I get a value saved on Approval Required I can use in the workflow, that will be false when the dropdown has the particular value, and the value of the Yes/No box any other time (which is really what I needed functionally).

MegaJerk
Userlevel 5
Badge +14

good to see that you have solved it, and in a safer way! 


 


Don't forget to mark your answer as the solution to this problem. 

L
Badge +3

Hello, thank you! This is exactly what I have been searching for! I tried it and it works. I LOVE that this way checks the box immediately when the drop down option is selected.  I am stumped though on how to customize the code to use my own value instead of the example word “alright.”  

 

Can you show me what the code would be if my drop down control is named “DeptOwner” and I want the box to be checked when they select “Learning & Development”? 

Here’s what I’m trying. I did select the control name from the Named Control tab as a named reference but it doesn’t work. Does it have something to do with the “LowerCase” part? I don’t know how to remove or edit that part and still keep the formula intact. Any help  is much appreciated!!

(function(formControlCall, dropDown){ var formControlID = formControlCall.split("'")[1] || ""; var targetControl = sourceContext.find("[formcontrolid='" + formControlID + "'].nf-filler-control").find("[formcontrolid][id]"); targetControl.prop("checked", dropDown.toLowerCase()=== "Learning & Development"); return false; }("{Self}", DeptOwner))

Reply


View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings