Jump to content
Sign in to follow this  
Vitalikssssss

Hide field on Submission form

Recommended Posts

Hi All,

I have a problem with one of my Submission form.

I need to conditionally hide a field if the user checks the checkbox field (Virtual). 

I have tried to achieve this functionality with standard Caspio feature call "Rules", however, it doesn`t save the value if the field is hidden with "Rule".

Forgot to mention the field receive an auth parameter on load. 

Can someone share with me a pure JS solution for hiding fields conditionally? 

Thanks,

vitalikssssss

 

Share this post


Link to post
Share on other sites

@Vitalikssssss

It is possible to implement this workflow using additional JS.

Please find the application with the same feature implemented - test.ziptest.ziptest.zip

Please note that you should disable HTML editor before you insert the code.
Here are the snippets of code you should insert into your datapage:

Header:

<style>

.cbHTMLBlockContainer {
 padding: 0 !important;
}

</style>

HTML Block under the field you want to hide:

<table style="margin: 0; padding: 0;" id="ruleDiv">

HTML Block below the field you want to hide:

</table>

Footer:

<script type="text/javascript">
document.addEventListener('DataPageReady', function (event) {

 let hide =  document.getElementById('ruleDiv')
 let checkId = 'cbParamVirtual1';

 document.getElementById(checkId).addEventListener('change', function (event) {
  if (event.target.value == "Y") {
   event.target.value = "N";
   hide.style.display = "none";
  } else if (event.target.value == "N") {
   event.target.value = "Y";
   hide.style.display = "";
  }
 });
});
</script>

 

You need to define the ID of your checkbox you want to use as a condition to define rule:
let checkId = 'cbParamVirtual1';

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...