Below is a simplified example of what I’d like to be able to do. Is this possible, and if so, any instructions/guidance would be appreciated!
(1) On page 1 user answers some questions
(2) Based on answers to question from page 1, I have logic that determines a number of outputs (e.g. If Box 1=A, show textA, if Box1=B, show textB)
----All easy so far. Here is where I have questions-----
(3) I want page 2 to display different information via inputs from page 1
Some of the output is text
Some of the output is a hyperlink (e.g. if textA, show Hyperlink to A, if textB, show Hyperlink to B)
I’d like to style the output (e.g. if CalcScore < 60, color=Red, else color=Green)
Any examples or guidance on:
(A) How to specify the ID of a text field in Advanced Logic (feathery.fields(“ID string”).value = “some text”; → is accepted as valid JS but doesnt do anything/work)
(B) How to specify the ID of a container in a text field in advanced logic
(C) How to access the style/properties variables of an element in advanced logic (e.g. TextID.style.link.set = “www.something.com”). NOTE: I’m aware of setStyles(), but would (i) love a code example using this (I cant make it work in Advanced Editor), and (2) I dont see the ability to do some thing like set the link for a Text field
You can refer to Javascript Rule Builder docs, and an example would be (instead of using (), use [] to wrap your field name):
feathery.fields[“ID string”].value = “some text”
However, given your use case, instead of dynamically setting links and styles, you can create all the text with different colors / links and conditionally hide/show them based on the input from page 1.
I appreciate the brainstorm/possible different route. That approach may work (I want to think on it more). But, given what I plan/need to do, I still may need to do it in JS code. As such, would appreciate answers on how to do (A), (B) and (C) above if I need to do with code.
Note: for (A) – your answer on using brackets instead of parentheses works IF the field is NOT a text field (not a text ENTRY field, just a text field. eg. ID 02f4b884-2086-4cba-8868-18ebbd0a7868.
From the provided screenshot it looks like you want to set value to a basic text element, instead of a text field (which is a field / box that takes in a user input). For text element you can leverage hidden fields.
In your form, you can input {{your-hidden-field-name}} in your basic text element:
To access the styling of the text element, you would write in Logic Rule with something like document.querySelector() (Document Object docs) to find the element you want, then change styles. Please note field.setStyles() is used for fields, not text element.
To enable a link on a text element, you can create separate logic rules with the trigger event to be clicking on the text element with the element’s ID, then redirect user to the link. If you want to enable a link on a field, you can refer to Open a Link action here.
I feel like I am encountering a bug with .setStyles(). The following code below should be valid (I tested it in other forms and it works/updates the background_color style of a slider element). But it is not working in my current form (the math part is working; but the .setStyles() portion is not updating the elements color when the criteria are met).
@kailash tried that; its actually the opposite (e.g. when you add a # for the hex it DOESNT work. It only works in a “test” form I created when you EXCLUDE the # when providing the hex value).
Also, just to confirm, I tried both methods (with and without hex) in the production form and neither worked.
LMK what to do next to get this working; appreciate it!
