• 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!

TOPIC: Show Field if Textfield has some value

Show Field if Textfield has some value 6 years 6 months ago #38563

  • pixmedien
  • pixmedien's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 4
  • Thank you received: 2
How can I show/hide a conditional field if a textfield has some value / is not emty?
The administrator has disabled public write access.

Show Field if Textfield has some value 6 years 6 months ago #38564

  • pixmedien
  • pixmedien's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 4
  • Thank you received: 2
If anyone interested, here's the solution from RS Support:

- head to Components > RSForm!Pro > Manage Forms > Select your form > Form Properties > CSS&Javascript
- add a script as the following in the Javascript field:

<script>
window.addEventListener('load', function() {
document.getElementsByClassName("rsform-block-textbox2")[0].style.display="none";
})

function myFunction(value){
if(value=='test'){
document.getElementsByClassName("rsform-block-textbox2")[0].style.display="block";
}else{
document.getElementsByClassName("rsform-block-textbox2")[0].style.display="none";
}
}
</script>

- head back to form fields and edit the field of which value you need to check
- switch to Attributes tab
- add the following trigger in its Additional Attributes field:

onkeyup="myFunction(this.value);"

This will trigger the function we have added in the Javascript section of the form.

Note that in the above-mentioned script, you will have to change:

- "rsform-block-textbox2" with the class of your form field container(the one that contains the field and label you want to hide)
- "test" with the value that the textbox should have in order to display the other field

Afterwards test this functionality one more time.

----

For my case I have changed onkeyup="myFunction(this.value);" to oninput="myFunction(this.value);" (so it works when you pull up the numbers in a number text field with the mouse.)
And in the Javascript-Section I changed if(value=='test') to { if(value>="0"){ (so it works for any number that is larger than 0)


Thanks to RS Support!
The administrator has disabled public write access.
The following user(s) said Thank You: sanjose.lsj, florent.tendil

Show Field if Textfield has some value 2 years 5 months ago #42374

  • duncan
  • duncan's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 19
  • Thank you received: 1
Hello,

This is an old thread and I'm not really a coder, but do my best and thanks to pixmedien for sharing the initial solution from RS support. Just looking for a further nudge or advice on how to take this code/solution a step further.

I am developing a feedback form, which will have standard questions and then I would like "consultants" to add their own questions as they wish. When the form is submitted an email will go to customers with a link. The link will populate a second form with the extra questions that the customer can then fill out - this bit I have already achieved in another form.

So, on the consultant's form, I want them to specify how many extra questions they want to ask - up to 10 questions. When they put the number in the first field, the right number of fields will display.

I've copied and manipulated the code here in this thread to achieve this and I'm happy to have got this far : See my form here

Here's my code so far:
<script>
window.addEventListener('load', function() {
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-6")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-7")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-8")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-9")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-10")[0].style.display="none";
})
 
function myFunction(value){
if(value=='1'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
}
else if(value=='2'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
}
else if(value=='3'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
}
else if(value=='4'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="block";
}
else if(value=='5'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="block";
}
else if(value=='6'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-6")[0].style.display="block";
}
else if(value=='7'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-6")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-7")[0].style.display="block";
}
else if(value=='8'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-6")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-7")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-8")[0].style.display="block";
}
else if(value=='9'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-6")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-7")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-8")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-9")[0].style.display="block";
}
else if(value=='10'){
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-6")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-7")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-8")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-9")[0].style.display="block";
document.getElementsByClassName("rsform-block-additional-question-10")[0].style.display="block";
}
else{
document.getElementsByClassName("rsform-block-additional-question-1")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-2")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-3")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-4")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-5")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-6")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-7")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-8")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-9")[0].style.display="none";
document.getElementsByClassName("rsform-block-additional-question-10")[0].style.display="none";
}
 
 
}
</script>

Taking it a step further: At present when the user inserts a number in the first field - the number of fields displays correctly, but if they revise the number down, the number of fields displaying stays the same.

I did a quick search and found on W3schools that I could possibly use a "switch" statement instead of the if / else if / else statements as seen here: Link to switch statements at W3Schools , but not being a coder it's not clear how i can apply it to my existing code in order to utilise the switch statement.

Any advice greatly appreciated as always.

Kind Regards

D
Last Edit: 2 years 5 months ago by duncan. Reason: links not showing
The administrator has disabled public write access.
  • 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!